无法更改Bootstrap CSS导航栏颜色

Question

我正在使用bootstrap CSS Navbar，我无法更改NavBar中文本的颜色。这是我的HTML代码：

    <nav class="navbar navbar-default navbar-fixed-top" ng-controller="NavCtrl">
       <ul class = "nav navbar-nav">
         <li><a class = "nav_color"><span class="glyphicon glyphicon-user"></span> UserName </a></li>

         <li><a class = "nav_color"><span class="glyphicon glyphicon-book"></span> Book </a></li>

         <li><a class = "nav_color"><span class="glyphicon glyphicon-pencil"></span> Pencil </a></li>
       </ul>
    </nav>

这是我的css代码：

    .nav_color {
       color: red;
    }

我不明白为什么这不起作用

Answer 1

AXC ，你好。

尝试这样做。

.nav.navbar-nav li a {
    color: red;
} 

Answer 2

您可以使用！important 。

.nav-color {
    color: red !important;
}

正在发生的事情是CSS具有特定的优先级来应用样式。其中一个因素是特异性计算。更具体的规则（如Bootstrap定义的那个）具有比其他更通用的规则（如您的类）更高的优先级。如果您使用！important ，则可以覆盖该规则的优先顺序。

有关详情，请查看this article。