Machen Sie den ganzen Text in .navbar-inverse in Bootstrap weiß

Question

Text in Navbar ist nicht weiß. Wie kann ich den gesamten Text innerhalb der .navbar-inversen Klasse weiß machen?

Ich bin mit diesem css

.navbar-inverse { 
    background-color: #05467C !important; 
    color: #FFF !important; 
} 

aber es funktioniert nicht.

Answer 1

Sie sind wahrscheinlich lin

:

I

.navbar-inverse * { 
    color: #FFF !important; 
} 

und es funktioniert, aber es scheint, diese Syntax wird nicht empfohlen, verwenden könnte ks, versuchen so das Hinzufügen folgende:

.navbar-inverse .navbar-nav > li > a { 
    color: #FFF; 
} 

Sie werden wahrscheinlich nicht wichtig brauchen Don und vielleicht nicht Farbe bg, aber Sie haben den Code teilen eine genaue Antwort zu bekommen.

Nächstes Mal empfehle ich Ihnen, Inspektor in Ihrem Browser zu verwenden, um den richtigen Selektor zu erhalten.

Answer 2

Bootstrap hat drei Selektoren unter .navbar-inverse, die eine Farbe verwenden, die nicht standardmäßig weiß ist:

/* Copied from Bootstrap 3's compiled bootstrap.css at line 4595 */ 
.navbar-inverse .navbar-brand { 
    color: #9d9d9d; 
} 
.navbar-inverse .navbar-text { 
    color: #9d9d9d; 
} 
.navbar-inverse .navbar-nav > li > a { 
    color: #9d9d9d; 
} 

diese außer Kraft zu setzen, einfach, diese exakt gleichen Wähler in Ihrem eigenen CSS:

.navbar-inverse .navbar-brand, 
.navbar-inverse .navbar-text, 
.navbar-inverse .navbar-nav > li > a { 
    color: #fff; 
} 

Für diesen blauen Hyperlink, den Sie haben, kann ich nur annehmen, dass Sie das außerhalb einer HTML-Struktur hinzugefügt haben, die Bootstrap selbst empfiehlt. Sie können wahrscheinlich mit dem Selektor umgehen: .navbar-inverse a, aber Sie müssen auch für seine :hover und :focus Staaten sorgen.

Alles in allem werden Sie wahrscheinlich mit so etwas wie am Ende:

.navbar-inverse .navbar-brand, 
.navbar-inverse .navbar-text, 
.navbar-inverse .navbar-nav > li > a, 
.navbar-inverse a, 
.navbar-inverse a:hover, 
.navbar-inverse a:focus { 
    color: #fff; 
}