改变导航丸的活跃颜色

Question

这是我用来在导航栏中激活药丸的代码。

  <ul class="nav nav-pills">

  <li class="<%= 'active' if current_page?(root_path) %>"><% yield (:home)%><%= link_to "Home", root_path%></li>

然而它使用默认的蓝色作为＆＃34;活跃＆＃34;我应该怎么改变这个？

这就是我已经拥有的css

.nav>li>a:hover,

.nav>li>a:focus{

 background-color: #5c8a36;}

即使这样（颜色应为绿色），它仍然显示为默认的蓝色

Answer 1

将以下行（.nav>li>a.active,）添加到您的css：

.nav>li>a.active,
.nav>li>a:hover,
.nav>li>a:focus {
   background-color: #5c8a36;
}

Answer 2

你那里没有<a>！

.nav>li:hover,
.nav>li:focus,
.nav>li:focus {
  background-color: #5c8a36;
}

<ul class="nav nav-pills">

  <li class="">
    Home
  </li>

</ul>

Answer 3

接受的答案对我不起作用。我改变了一点，现在正在工作。

.nav-pills>li.active>a,
.nav-pills>li.active>a:focus,
.nav-pills>li.active>a:hover {
   background-color: #5c8a36;
}