Comment ajouter un logo à la barre de navigation bootstrap

La majorité des sites Web professionnels affichent une petite icône à côté de leur nom sur la page d'accueil appelée «Logo". Cette icône de barre d'adresse est également connue sous le nom de favicon. Il fournit au site Web la reconnaissance et l'autorité de la marque. Plus précisément, Bootstrap propose une classe "marque de navigation"Pour ajouter un logo au site Web. Cette classe peut être appliquée à la plupart des éléments. Cependant, la balise «» est la meilleure pour placer un logo.

Ce message couvrira:

• Comment ajouter un texte de logo à la barre de navigation bootstrap?
• Comment ajouter une image de logo à la barre de navigation bootstrap?

Comment ajouter un texte de logo à la barre de navigation bootstrap?

Pour créer une barre de navigation, suivez les étapes mentionnées ci-dessous:

• Ajouter un "
• Ensuite, utilisez le «"Élément avec la classe"marque de navigation"Pour inclure un texte de logo.
• Après avoir ajouté le logo, implémentez le «
  " et "
  • »Éléments pour ajouter les éléments du menu de navigation.

  Html

  Les classes spécifiées dans le bloc de code ci-dessus sont expliquées ci-dessous:

  • "barre navale" et "Navbar-Default»Sont utilisés pour créer une barre de navigation standard.
  • "navbar-expand-lg"La classe rend une barre de navigation réactive.
  • "Navbar-Light”Définit la couleur du texte de la barre de navigation à Dark. Il est utilisé lorsque l'élément a un fond léger.
  • "Bg-Light”Ajuste la couleur de fond de la barre de navigation en un gris clair.
  • "Naval-Item«La classe est utilisée pour ajouter les éléments de navigation.
  • "actif"La classe fait mettre en évidence l'élément ou se démarquer pour montrer qu'il est actuellement actif.
  • "liaison de navigation»Fournit des styles pour les liens de navigation.

  Sortir
  

  Comment ajouter une image de logo à la barre de navigation bootstrap?

  Pour placer une image en tant que logo, utilisez le «”Tag au lieu du texte en suivant les étapes:

  • Premièrement, le «"La balise est placée avec la classe"marque de navigation". Le "href«Attribut du«”La balise contient la référence de la page liée.
  • L'image du logo est placée à l'intérieur du «" élément. Les attributs «SRC», «Largeur» et «Hauteur» sont utilisés pour ajuster l'image.
  • Le "SRC»L'attribut définit l'URL de l'image.
  • Le "largeur" et "hauteur”Déterminez l'étendue et la hauteur de l'image:
  La «largeur» et la «hauteur» déterminent l'étendue et la hauteur de l'image:
  
  
  

  Sortir
  

  On peut observer que nous avons réussi à ajouter le logo de la page Web créée.

  Conclusion

  Pour ajouter un logo, créez d'abord une barre de navigation en utilisant le «