Twitter bootstrap 更改导航选项卡上的悬停颜色

我想更改悬停导航选项卡的文本颜色，因此我将其命名为：nav nav tabs custom，因此视图中的代码如下所示：

      <li class="active"><%= link_to "Overview", '#'  %>           
      </li>
      <li><%= link_to "About",    '#' %></li>
      <li><%= link_to "What we do", '#' %></li>
      <li><%= link_to "Partners", '#' %></li>
      <li><%= link_to "Contact", '#' %></li>
      <li><%= link_to "Support", '#' %></li>
    </ul>

---

但它不起作用。有人能帮我吗？

您需要将选择器设置得更具体一点，以正确定位选项卡。试试这个：

.custom > li > a:hover {
    color: black;
}

---

顺便说一句，如果您想在鼠标悬停时将选项卡的背景色更改为

color

属性为

background color
的话，这只会更改文本的颜色。安德烈斯说得对。要替代的样式设置为：

.nav-bar > li > a:hover

如果您在Twitter引导中使用较少，那么已经有了一些变量：

@navbarLinkColor
@navbarLinkColorHover
@navbarLinkColorActive

请参阅文档部分。
Set@navbarLinkBackgroundHover
这对我来说很有效，除了默认引导之外，没有太多“特殊性”


ul.nav>li>a:悬停{
背景色：#000000；
颜色：#FFFFFF；
边框样式：无；
}
如果我告诉你，你的代码在我的应用程序中不会改变颜色，你会怎么说？问题出在哪里？@DenysMedynskyi您是否将
.custom
类放置在导航选项卡容器上？这里有一个简单的演示，我展示了它是如何工作的：我有和你一样的代码，但它不工作。我甚至插入了你的代码而不是我的。我就是不明白为什么？@DenysMedynskyi你在哪里写css？在您自己的样式表或引导样式表上，它们以什么顺序放置在页面的标题中？我正在custom.css.scss文件中编写css。我正在使用清单5.10创建标题。谢谢您的帮助，但上一篇文章对我没有帮助。你能告诉我为什么吗？还有一个问题。我在我的scss文件@navbarLinkColorHover中写道：@graydroker；这一行，错误在“…LinkColorHover:”后表示无效CSS：预期的伪类或伪元素为“@Graydroker；”我的错误在哪里？将.nav栏更改为.nav选项卡（适用于您的示例），它应该可以工作。
@navbarLinkColor
@navbarLinkColorHover
@navbarLinkColorActive