Pourquoi ma barre de navigation Bootstrap disparaît-elle sur les petits appareils ?

La barre de navigation Bootstrap disparaît sur les petits appareils

Lors de la création d'une barre de navigation Bootstrap, vous pouvez rencontrer une navigation masquée et une icône de hamburger manquante sur des écrans plus petits. En effet, les paramètres par défaut de la barre de navigation sont conçus pour les écrans plus grands.

Solution

Pour résoudre ce problème, vous devez ajouter la classe appropriée à votre barre de navigation. Pour Bootstrap 5, utilisez la classe navbar-light ou navbar-dark.

<nav>

Pour Bootstrap 4 et les versions antérieures, utilisez la classe navbar-default. Vous pouvez également définir une couleur d'arrière-plan pour la barre de navigation ou assombrir l'icône de bascule comme suit :

#navbar-primary .navbar-nav { 
   background: #ededed;
}

.navbar-toggle .icon-bar {
    background-color: rgb(136, 136, 136);
}

Une fois que vous avez appliqué ces modifications, votre barre de navigation devrait s'afficher correctement sur toutes les tailles d'écran.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!