Barre de navigation CSS

Démo : Barres de navigation

Barres de navigation

Avoir une navigation facile à utiliser est important pour tout site Web.

Avec CSS, vous pouvez transformer des menus HTML ennuyeux en barres de navigation attrayantes.

Barre de navigation = Liste des liens

Une barre de navigation a besoin de HTML standard comme base.

Dans nos exemples, nous allons construire la barre de navigation à partir d’une liste HTML standard.

Une barre de navigation est essentiellement une liste de liens, donc l’utilisation des éléments

et
• est parfaitement logique :

  Exemple

  • Accueil
  • Actualités
  • Contact
  • À propos

  Essayez-le vous-même »

  Supprimons maintenant les puces, les marges et le rembourrage de la liste :

  Exemple expliqué :

  • list-style-type: none; – Supprime les balles. Une barre de navigation n’a pas besoin de marqueurs de liste
  • Ensemble margin: 0; et padding: 0;
    pour supprimer les paramètres par défaut du navigateur

  Le code de l’exemple ci-dessus est le code standard utilisé dans les barres de navigation verticales et horizontales, sur lequel vous en apprendrez plus dans les chapitres suivants.