Bootstrap Navbar品牌颜色变化调试

Question

我的样式表/ custom.css.scss

中有以下内容

@import "bootstrap";

.navbar-inverse .navbar-brand {
        color: #f0ad4e;
    }

我布局/ application.html.erb中使用的布局/ _header.html.erb中的以下内容

<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
  <div class="container-fluid">
    <!-- Brand and toggle get grouped for better mobile display -->
    <div class="navbar-header">
      <a class="navbar-brand">....... etc..

为什么我的导航栏品牌不会改变颜色！它让我发疯了！

在我的检查员中，我看到以下内容：

.navbar-inverse .navbar-brand {
color: #999999;
}

所以它没有生效，有什么想法吗？

Answer 1

我解决了这个问题。这显然是诀窍：

.navbar-inverse .navbar-header .navbar-brand {
    color: #f0ad4e;
} 

Answer 2

尝试将选择器的特异性提高到：

nav.navbar.navbar-inverse > div.navbar-header > a.navbar-brand {
    color: #f0ad4e;
}

上述情况可能过度 - 如果它有效，你应该考虑减少它。