La grande différence entre Bootstrap 2 et Bootstrap 3 est que Bootstrap 3 est "mobile first".
Cela signifie que les styles par défaut sont conçus pour les appareils mobiles et dans le cas de Navbars, cela signifie qu'il est "réduit" par défaut et "se développe" lorsqu'il atteint une certaine taille minimale.
Le site de Bootstrap 3 a en fait une "indication" de ce qu'il faut faire:
http://getbootstrap.com/components/#navbar
Personnaliser le point de repli
Selon le contenu de votre barre de navigation, vous devrez peut-être modifier le point auquel votre barre de navigation bascule entre le mode réduit et le mode horizontal. Personnalisez la variable @ grid-float-breakpoint ou ajoutez votre propre requête multimédia.
Si vous allez recompiler votre MOINS, vous trouverez la variable MOINS notée dans le variables.less
fichier. Il est actuellement configuré pour "s'étendre" @media (min-width: 768px)
qui est un "petit écran" (c'est-à-dire une tablette) selon les termes de Bootstrap 3.
@grid-float-breakpoint: @screen-tablet;
Si vous souhaitez conserver l'effondrement un peu plus longtemps, vous pouvez l'ajuster comme ceci:
@grid-float-breakpoint: @screen-desktop;
(Point d'arrêt 992px)
ou développez plus tôt
@grid-float-breakpoint: @screen-phone
(Point d'arrêt 480px)
Si vous souhaitez le développer plus tard et ne pas avoir à recompiler le MOINS, vous devrez remplacer les styles appliqués à la 768px
requête multimédia et les faire revenir à la valeur précédente. Ajoutez-les ensuite au moment opportun.
Je ne sais pas s'il y a une meilleure façon de le faire. Recompiler le Bootstrap MOINS à vos besoins est la meilleure façon (la plus simple). Sinon, vous devrez trouver toutes les requêtes multimédia CSS qui affectent votre barre de navigation, les remplacer par des styles par défaut à la largeur de 768 pixels, puis les rétablir à une largeur minimale plus élevée.
Recompiler le MOINS fera toute cette magie pour vous juste en changeant la variable. Ce qui est à peu près le point des pré-compilateurs LESS / SASS. =)
(Remarque, je les ai tous recherchés, il s'agit d'environ 100 lignes de code, ce qui est assez ennuyeux pour moi de laisser tomber l'idée et de recompiler Bootstrap pour un projet donné et d'éviter de gâcher quelque chose par accident)
J'espère que ça aide!
À votre santé!