Bootstrap-Navigationsleiste: Elemente verschwinden auf kleineren Geräten
Sie haben eine Bootstrap-Navigationsleiste mit einem markanten Logo in der Mitte entworfen, das jedoch verschwindet, wenn das Bildschirmgröße schrumpft. Auch das Hamburger-Menü bleibt verborgen. Dieses Problem kann durch die Berücksichtigung mehrerer Faktoren gelöst werden.
Darstellung der Navigationsleiste auf Mobilgeräten
Bootstrap basiert auf Medienabfragen, um das Verhalten der Navigationsleiste für verschiedene Bildschirmgrößen anzupassen. Die folgenden CSS-Klassen spielen eine entscheidende Rolle:
navbar-default (or navbar-light for Bootstrap 4+) navbar-dark
Anwenden der Navbar-Klasse
Um eine korrekte Anzeige auf Mobilgeräten sicherzustellen, wenden Sie die entsprechende Navbar-Klasse auf Ihren Code an :
<nav>
Alternativ können Sie der Navigationsleiste eine benutzerdefinierte Hintergrundfarbe hinzufügen oder die Umschalttaste abdunkeln:
#navbar-primary .navbar-nav {
background: #ededed;
}
.navbar-toggle .icon-bar {
background-color: rgb(136, 136, 136);
}Das obige ist der detaillierte Inhalt vonWarum verschwindet meine Bootstrap-Navbar auf kleineren Geräten?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
