bootstrap仅覆盖1个导航颜色

Question

我想问你如何改变bootstrap 3中只有一个导航'按钮'的颜色，例如，我想只格式化新闻部分（男性不同）如何更改bg只有这个按钮（tab元素）的颜色，悬停等，另一个会使用主要样式吗？

 <nav>
    <ul class="nav nav-justified">
      <li><a href="/news">news</a></li>
      <li><a href="http://shop.1.com/">shop</a></li>
    </ul>
  </nav>

Answer 1

您可以为具有“新闻”链接的特定<li>元素（让我们将该类命名为"li-news-item"）提供课程：

<li class="li-news-item"><a href="/news">news</a></li>

...并使用它作为选择器来设置包含a：

的样式

nav ul li.li-news-item a {
    color: purple;
    background-color: white;
}

nav ul li.li-news-item a:hover {
    color: white;
    background-color: purple;
}

CodePen

PS：由于您的问题是明确询问如何更改特定的nav项目颜色，因此我已将CSS规则specific enough仅应用于列表中包含的a您"li-news-item"的等级nav的项目。