我想更改鼠标悬停导航选项卡的文本颜色,所以我命名为: 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.css.scss中的代码
.custom a:hover {color: black;}
但它不起作用。有人能帮帮我吗?
发布于 2012-05-18 20:30:39
您需要使您的选择器更具体一点,以正确定位您的选项卡。试试这个:
.custom > li > a:hover {
color: black;
}
顺便说一下,如果您想在鼠标悬停时更改选项卡的背景颜色,将color
属性切换为background-color
,这只会更改文本的颜色。
发布于 2012-05-19 06:38:01
Andres关于特异性的看法是正确的。要替代的样式设置为:
.nav-bar > li > a:hover
如果你在Twitter Bootstrap中使用LESS,这里已经有了一些变量:
@navbarLinkColor
@navbarLinkColorHover
@navbarLinkColorActive
请参阅文档的Navbar部分。
发布于 2015-08-07 23:32:31
这对我来说没有太多的“特异性”,除了默认的Bootstrap...
ul.nav > li > a:hover {
background-color: #000000;
color: #FFFFFF;
border-style: none;
}
https://stackoverflow.com/questions/10647997
复制相似问题