在导航标签上更改悬停颜色

Question

我想更改悬停nav-tabs的文本颜色,所以我将其命名为: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;}

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

Answer 1

您需要使选择器更具体一些,以正确定位选项卡.试试这个:

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

顺便说一下,如果你想在悬停切换color属性时更改标签的背景颜色,这只会改变文本的颜色background-color.