J'utilise la barre de navigation bootstrap et j'ai inséré une image dans la marque de la barre de navigation, mais en raison de la taille, cela gâche l'alignement. Je veux que le texte qui l'accompagne soit aligné avec le milieu de celui-ci, mais je ne sais pas comment aligner également le texte de l'autre bouton avec lui.
Voici à quoi ressemble le résultat
<a class ="navbar-brand" id="home" href="/">
<img src="https://cdn.discordapp.com/attachments/901496285759168554/1045812932535128084/jeffersonlogo.webp" width="40" height="60" class="d-inline-block align-middle" alt="">
Jefferson Robotics</a>
<a class="nav-item nav-link" id="water" href="/underwater">Underwater</a>
<a class="nav-item nav-link" id="sky" href="/aerial">Aerial</a>
<a class="nav-item nav-link" id="earth" href="/land">Land</a>
J'ai essayé d'utiliser l'alignement sur les éléments de navigation mais peu importe ce que je fais cela ne change rien, c'est la première fois que j'utilise bootstrap et mes connaissances en HTML sont limitées donc je n'ai absolument aucune idée de quoi faire : (< /p>
![[Web front-end] Démarrage rapide de Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
Je ne sais pas quel est le problème avec votre implémentation. J'ai essayé d'envelopper votre extrait avec un conteneur de navigation comme mentionné dans la documentation bootstrap et ça a l'air bien :
a.nav-item { color: white; } a.nav-item:hover { color: yellow; }Peut-être qu'il vous manque juste cet emballage ? Ou peut-être n'avez-vous pas inclus les styles de bootstrap dans les styles statiques de votre fichier HTML ?
Vous pouvez essayer toutes les
<a>标记以及navbar-brand<a>标记上使用引导程序中的d-flexalign-items-centerclasses sur l'élément parent comme indiqué ci-dessous. Cela centrera l'élément verticalement.