无法更改 Bootstrap CSS 导航栏颜色答案

【问题标题】：Unable to change Bootstrap CSS Nav Bar Color无法更改 Bootstrap CSS 导航栏颜色
【发布时间】：2015-07-11 01:08:01
【问题描述】：

我正在使用引导 CSS 导航栏，但无法更改导航栏中文本的颜色。这是我的 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;
    }

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

【问题讨论】：

标签： twitter-bootstrap css colors uinavigationbar

【解决方案1】：

AXC，您好。

尝试这样做。

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

【讨论】：

如何关闭问题？
看起来你刚刚做了。

【解决方案2】：

您可以使用 !important。

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

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

更多信息，请查看this article。

【讨论】：

谢谢，这真的很有趣！