Wie ändert man die Stile von Navbars in Twitter Bootstrap 3 mit Less oder CSS? Verwenden verschiedener Stile, wie von den Klassen navbar-default und navbar-inverse bereitgestellt.
Genau wie Buttons und Panel wird eine Navbar zwei Klassen haben (siehe: Ссылка ). Die erste Klasse ( .navbar ) wird die Struktur festlegen. Die zweite Klasse wird das Styling einstellen. Standardmäßig gibt es zwei Klassen für das Styling: .navbar-default und .navbar-inverse . Um den Stil Ihrer Navigationsleiste zu ändern, müssen Sie die Stile dieser Stilklassen ändern. Der beste Weg, dies zu tun ist mit Less und neu kompilieren Bootstrap.
Die Variablen für .navbar-default und .navbar-inverse werden in variables.less gesetzt und von navbar.less verwendet. Um einen benutzerdefinierten Navigationsleistenstil zu definieren, könnten Sie die Variable für .navbar-default oder .navbar-inverse ändern und diese Klassen wiederverwenden. Wenn Sie den ursprünglichen Code nicht ändern möchten. Erstelle eine customnavbar.less-Datei (vergiss nicht, diese in bootstrap.less zu importieren) und kopiere den .navbar-default -Teil von navbar.less in diese Datei. Benenne und setze die Variablen. Sein. siehe hier: Twitter Bootstrap ändern 3.0 navbar Klasse Hintergrundfarbe in weniger um den Hintergrund blau zu setzen.
Definieren Sie Ihre CSS genau wie .navbar-default . Um den Stil zu ändern. Sein. für <nav class"navbar navbar-custom"> und setze Hintergrund auf blau;
.navbar-custom { background-color: #0000FF;}
Weitere Stile und einfaches Styling finden Sie in Ссылка
Tags und Links css3 less twitter-bootstrap twitter-bootstrap-3 navbar