La grande differenza tra Bootstrap 2 e Bootstrap 3 è che Bootstrap 3 è "mobile first".
Ciò significa che gli stili predefiniti sono progettati per dispositivi mobili e nel caso di Navbar, ciò significa che è "compresso" per impostazione predefinita e "si espande" quando raggiunge una determinata dimensione minima.
Il sito di Bootstrap 3 ha in realtà un "suggerimento" su cosa fare:
http://getbootstrap.com/components/#navbar
Personalizza il punto di collasso
A seconda del contenuto della barra di navigazione, potrebbe essere necessario modificare il punto in cui la barra di navigazione passa dalla modalità compressa a quella orizzontale. Personalizza la variabile @ grid-float-breakpoint o aggiungi la tua media query.
Se ricompilerai il tuo LESS, troverai la variabile LESS indicata nel variables.less
file. Attualmente è impostato su "espandi" @media (min-width: 768px)
che è un "piccolo schermo" (ad es. Un tablet) con termini Bootstrap 3.
@grid-float-breakpoint: @screen-tablet;
Se vuoi mantenere il collasso un po 'più a lungo, puoi regolarlo in questo modo:
@grid-float-breakpoint: @screen-desktop;
(Punto di interruzione 992 px)
o espandere prima
@grid-float-breakpoint: @screen-phone
(Punto di interruzione 480px)
Se vuoi che si espanda in un secondo momento e non ti occupi di ricompilare il MENO, dovrai sovrascrivere gli stili che vengono applicati al 768px
media query e riportarli al valore precedente. Quindi aggiungerli nuovamente al momento opportuno.
Non sono sicuro che esista un modo migliore per farlo. Ricompilare Bootstrap MENO per le tue esigenze è il modo migliore (più semplice). Altrimenti, dovrai trovare tutte le query multimediali CSS che riguardano la tua Navbar, sovrascriverle agli stili predefiniti alla larghezza di 768px e quindi ripristinarle a una larghezza minima superiore.
Ricompilare il MENO farà tutta quella magia per te semplicemente cambiando la variabile. Questo è praticamente il punto dei pre-compilatori LESS / SASS. =)
(nota, li ho cercati tutti, sono circa 100 righe di codice, il che è abbastanza fastidioso per me abbandonare l'idea e ricompilare Bootstrap per un determinato progetto ed evitare di rovinare qualcosa per caso)
Spero che aiuti!
Saluti!