Chargement…
Créer Barre Menu Fixe

Créer Barre Menu Fixe



Dans ce web design css tutoriel je vais vous montrez comment créer une barre menu fixe en haut de la page. Dans notre exemple nous allons créer une petite barre en-tête (Header) avec une position fixe, puis on ajouteras une bannière qui permettra a notre Header de rester visible en permanence. Cette effet se nomme : Collapsing Effect.

Créer Barre Menu Fixe

Créer Barre Menu Fixe

On commence avec le CSS : Première note on utilise une position fixe, Cela permettra a notre Barre de Menu sur la Header de rester visible même si on descend en bas par la barre de défilement. Pour être sûr que le contenu ne dépasse pas notre Barre on utilise z-index avec une valeur de 10.

Ce deuxième code va permettre à activer l’effet Fixe de la Header avec une position Fixe, pour cette DIV en lui affecte une déclaration Top de 100px pour être sûr qu’il sera au-dessous de la Header.

Maintenant que notre deux DIV sont fixe, le contenu doit avoir une position Relative cela va permettre à notre contenu de continuer son défilement alors que notre barre de menu à l’en-tête reste fixe.

Voire la Démonstration



Laisser un commentaire