Le template Album TEMPLATES:Album

1. Les fichiers du template

Dans les exemples de Bootstrap, nous allons étudier le template nommé Album :

images/C13-011.png

Le dossier à télécharger de cet exemple est nommé 13-Template-02.

 Dans le dossier décompressé précédemment bootstrap-4.3.1, allez dans /site/docs/4.3/examples/album.

Vous y trouverez les deux fichiers de cet exemple : album.css et index.html. Ces fichiers reprennent la même structure que pour l’exemple précédent. Nous n’allons pas revoir toutes les liaisons et la personnalisation de l’en-tête, ils sont similaires. Reportez-vous à l’exemple Carousel.

2. La structure de l’en-tête EN-TÊTE:Template Album

Sur la gauche nous avons un bouton et un libellé Album qui permettent de revenir sur la page d’accueil. Sur la droite, le menu de navigation s’affiche par défaut sous la forme d’un menu hamburger.

images/C13-012.png

Si vous cliquez sur le menu hamburger, celui-ci affiche l’en-tête, avec deux sections : About et Contact.

images/C13-013.png

Tout l’en-tête est placé dans un élément <header>, contenant deux boîtes <div> :

<header> 
        <div class="collapse bg-dark" id="navbarHeader"> 
                ... 
        </div> 
        <div class="navbar navbar-dark...
Pour consulter la suite, découvrez le livre suivant :
couv_OW24BOO.png
60-signet.svg
En version papier
20-ecran_lettre.svg
En version numérique
41-logo_abonnement.svg
En illimité avec l'abonnement ENI
130-boutique.svg
Sur la boutique officielle ENI
Précédent
Le template Carousel
Suivant
Les thèmes Bootstrap