改变。有源标签的默认颜色引导

我想改变我的导航栏的活动标签的颜色，我使用的引导，这里是我的代码：改变。有源标签的默认颜色引导

<body> 
    <nav class = "navbar navbar-default navbar-fixed-top"> 
    <div class = "container-fluid"> 
     <div class = "navbar-header"> 
     <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#main_navbar"> 
      <span class="fa fa-bars"></span> 
     </button> 
     <a class="navbar-brand" href="#">Navbar</a> 
     </div> 
     <div class="collapse navbar-collapse" id="main_navbar"> 
     <ul class="nav navbar-nav"> 
      <li class="active"><a href="#">Menu 1</a></li> 
      <li><a href="#">Menu 2</a></li> 
      <li><a href="#">Menu 3</a></li> 
     </ul> 
     </div> 
    </div> 
     </nav> </body>

我试图用这个来改变它但没有工作（css文件）：

.active { 
    background-color: green !important; 
}

也是这样（JavaScript文件）：

$(document).ready(function() { 
    $('.active').css("background-color", "green"); 
});

编辑：

我试着用一小段代码片段，但CSS部分解释更多，如果我加入这我的CSS文件并没有为我工作，

：

.navbar { 
    background-color: yellow; 

}

整条变为黄色，外活动标签，那个颜色是我想改变的那个。

来源

2016-05-30 Laxus

Bootstrap对我来说确实很愚蠢，几乎所有的实际造型都是在导航栏中的<a>标签上，而不是像大多数人会做的<li>那样。你应该改变.active a大部分风格，而不是仅仅.active

.active a { 
 

 
    background-color: green !important; 
 

 
}

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" /> 
 
<nav class="navbar navbar-default navbar-fixed-top"> 
 
    <div class="container-fluid"> 
 
    <div class="navbar-header"> 
 
     <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#main_navbar"> 
 
     <span class="fa fa-bars"></span> 
 
     </button> 
 
     <a class="navbar-brand" href="#">Navbar</a> 
 
    </div> 
 
    <div class="collapse navbar-collapse" id="main_navbar"> 
 
     <ul class="nav navbar-nav"> 
 
     <li class="active"><a href="#">Menu 1</a> 
 
     </li> 
 
     <li><a href="#">Menu 2</a> 
 
     </li> 
 
     <li><a href="#">Menu 3</a> 
 
     </li> 
 
     </ul> 
 
    </div> 
 
    </div> 
 
</nav>

来源

2016-05-30 21:10:31 Jhecht

非常感谢你 – Laxus

改变。有源标签的默认颜色引导

回答

相关问题