Zmiana koloru aktywnego tła karty z zakładkami w bootstrap 3.0

Question

Korzystam z następujących css, aby zmienić aktywny kolor tła paska rozwijanego w pasku poleceń.

.navbar .nav > li.dropdown.open.active > a:hover, 
.navbar .nav > li.dropdown.open > a 
{ 
    color: #fff; 
    background-color: #b91773; 
    border-color: #fff; 
} 

Poprawnie zmienia kolor tła aktywnego linku rozwijanego, jak pokazano na zrzucie ekranu.

Ale jeśli przedłużam ten sam css dla nav-tabs, to nie działa. tutaj jest klasa css

.nav .nav-tabs > li.dropdown.open.active > a, 
.nav .nav-tabs > li.dropdown.open.active > a:hover 
{ 
    color: #fff; 
    background-color: #b91773; 
    border-color: #fff; 
} 

Oto wyjściowy

Jak rozwiązać ten problem.

Answer 1

myślę, że to powinno działać:

.nav.nav-tabs > li.dropdown.active.open > a, 
.nav.nav-tabs > li.dropdown.active.open > ul.dropdown-menu a:hover, 
.nav.nav-tabs > li.dropdown.open > a, 
.nav.nav-tabs > li.dropdown.open > ul.dropdown-menu a:hover 
{ 
    color: #fff; 
    background-color: #b91773; 
    border-color: #fff; 
} 

Uwaga bez spacji między .nav.nav-tabs przyczyny, aby wybrać dla posiadający obydwie a nie sekundy, a następnie pierwszy.

daszek:

.nav.nav-tabs > li.dropdown.active.open > a span.caret {border-top-color: #fff;border-bottom-color: #fff;} 

Answer 2

Należy fint dokładną klasę menu rozwijanego. Może być w twojej nawigacji lub nie. Zmieniłem aktywnej klasy kolor własności stronicowania tematu Bootstrap tak:

ul.dropdown-menu>li.active>a:hover{ 
    background: #419641 !important; 
} 

ul.dropdown-menu>li.active>a{ 
    background: #51AB51 !important; 
} 

Answer 3

To byłoby o wiele łatwiejsze, jeśli można zrobić jsfiddle. jeśli nie, to możesz zrobić.

1 - upewnij się, że zakładka Dodano leży dokładnie w klasach ".nav .nav-tabs> li.dropdown.open.active", a ścieżka jest prawidłowa. JEŚLI nie, to nie zadziała.

2- Dowiedz się, czy dodano klasę, która nie jest odpowiednia lub czy nie dodano odpowiedniej klasy.

Answer 4

Co pracował dla mnie:

.navbar-default .navbar-nav .dropdown.open a:focus { 
    background-color: #6dbcc9; 
}