In Twitter bootstrap 2.3.2 kann ich folgendes haben: Ссылка
%Vor%Eine Twitter-Bootstrap-Navigationsleiste, in der in der mobilen Antwortansicht "Fixed Link" in der Kopfzeile sichtbar bleibt.
Jetzt, in Bootstrap 3, nach dem Upgrade meines Codes, kann ich nur haben: Ссылка
%Vor%in Mobile Responsive View, ich bekomme 2 Zeilen ... Ich habe versucht, in einen "navbar-header" -Knoten Ссылка oder in den ersten "navbar-header" ohne Erfolg einzubinden.
Was habe ich vermisst?
Danke,
Alexandre
Die zwei Zeilen in der mobilen Navigationsleiste werden durch den Clearfix des Navbar-Headers verursacht:
%Vor%Sie können Medienabfragen und css verwenden, um diesen Clearfix rückgängig zu machen (und fügen Sie ein neues vor dem ausgeblendeten Dropdown-Menü hinzu)
%Vor%demo: Ссылка
Die Medienabfragen fügen auch ein Float-Recht für die Navigationsleiste rechts auf kleineren Bildschirmen hinzu. Um diesen Code in der Produktion zu verwenden, werden Sie vielleicht die Grenzen und die navbar-css-Transformationen ebenfalls korrigieren.
Das Problem liegt an dem Punkt, an dem der navbar
zusammenbricht. Standardmäßig wird Bootstrap bei 768px minimiert. Wenn Sie dies erhöhen, wird Ihr navbar
schneller zusammenbrechen und Ihr Problem wird verschwinden.
Am besten passen Sie Ihre Bootstrap-Datei an und ändern Sie @grid-float-breakpoint
auf 850px (oder die von Ihnen benötigte Größe). Sie können Bootstrap 3 von Ссылка
Hoffe, das hilft.
Ich habe es so gemacht. Direkt nach der Marke fügen Sie zwei neue Zeilen mit derselben Klasse und einer zusätzlichen Klasse hinzu.
%Vor%Und fügen Sie dies Ihrer CSS-Datei hinzu:
%Vor%Home, Punkt 1 und Punkt 2 bleiben in der Navigationsleiste, wenn die Größe geändert wird und die Navigationsleiste nicht bricht.
Tags und Links html css twitter-bootstrap twitter-bootstrap-3 navbar