在bootstrap 3.0中更改活动下拉选项卡背景颜色

Question

我使用以下css来更改导航栏下拉列表活动链接的背景颜色。

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

正确更改活动下拉链接的背景颜色，如屏幕截图所示。

但如果我为nav-tabs扩展相同的css，它就不起作用了。这是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;
}

这是输出

如何解决此问题。

Answer 1

我认为这应该有效：

.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;
}

请注意，.nav.nav-tabs之间没有空格可以选择同时选择两个而不是第二个跟随第一个。

插入符号：

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

Answer 2

您应该在下拉菜单中找到确切的类别。它可能在您的导航中或不在导航中。我更改了Bootstrap主题的分页属性的活动类颜色，如下所示：

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

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

Answer 3

如果你能成为一名小人，那将会容易得多。如果没有，那么这就是你能做的。

1-确保添加的标签完全位于＆＃34; .nav .nav-tabs＆gt; li.dropdown.open.active＆＃34;类和路径是正确的。如果没有，它就无法工作。

2-所以，看看你是否添加了一个不相关的课程，或者你没有添加相关的课程。

Answer 4

对我有用的是什么：

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