bootstrap 3 navbar branding color

Question

Używam paska nawigacyjnego bootstrap 3, ale z jakiegoś powodu nie mogę zmienić koloru tekstu marki ani rozwijanych trójkątów. Próbowałem kilka rzeczy, ale nadal nie szczęścia ...

.navbar .nav > .navbar-brand > a { 
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25); 
    color: #d6d6d6; 
} 

.navbar-brand { 
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25); 
    color: #d6d6d6; 
} 

.navbar-brand a{ 
    text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25); 
    color: #d6d6d6; 
} 

Answer 1

W pliku bootstrap.css:

.navbar-default .navbar-brand { 
    color: #777777; 
} 

gdzie kolor tekstu Marka jest ustawiony. Zmieniłem to na color: #ff0000 i pomyślnie zmieniono na czerwony. Aby zmienić kolor trójkąta rozwijanej zmienić wartości koloru tutaj

.navbar-default .navbar-nav > .dropdown > a .caret { 
    border-top-color: #777777; 
    border-bottom-color: #777777; 
} 

Dla różnych kolorach przy aktywowaniu etc dla trójkątów rozwijanych:

.navbar-default .navbar-nav > .dropdown > a:hover .caret, 
.navbar-default .navbar-nav > .dropdown > a:focus .caret { 
    border-top-color: #333333; 
    border-bottom-color: #333333; 
} 

.navbar-default .navbar-nav > .open > a .caret, 
.navbar-default .navbar-nav > .open > a:hover .caret, 
.navbar-default .navbar-nav > .open > a:focus .caret { 
    border-top-color: #ff0000; 
    border-bottom-color: #ff0000; 
} 

Answer 2

Jest to kwestia swoistość. Deklaracja zawarta w CSS Bootstrapa jest bardziej szczegółowa niż twoja. Proszę wpisać Niniejsze oświadczenie sposób:

.navbar-default .navbar-brand { 
    color: #d6d6d6; 
} 

prostu za pomocą .navbar-brand jest mniej specyficzna i dlatego ignorowane. Możesz przeczytać trochę o specyficzności here.

Answer 3

Jeśli Twoje style nie przynoszą efektu, jest to problem specyficzny. Użyj Inspektora sieci w przeglądarce Chrome lub Safari, a dowiesz się, jakie style obowiązują, a także selektora używanego do stosowania tych stylów.

Answer 4

Jeśli navbar jest czarny używasz navbar-odwrotną, więc te rozwiązania nie będą działać.

Więc w tym przypadku użytku:

.navbar-inverse .navbar-brand { 
    color: #d6d6d6; 
} 

Answer 5

Jeśli inne sugestie tutaj nie pracują dla ciebie po prostu dodać

ważne

(Żaden z nich nie pracował dla mnie aż dodałem ważne!)

.navbar-brand { 
    color: #ffffff !important; 
}