样式表更改字体大小但不是颜色？

我有一个Ruby on Rails应用程序，使用bootstrap gem和一个本地样式表。目前，导航栏菜单项为灰色，悬停时变为白色。我希望他们在悬停时变黑，因为酒吧背景是白色的。样式表更改字体大小但不是颜色？

在尝试了很多事情之后，我现在正在寻找更简单的东西：只需制作一个黑色链接。我已附加一个类的链接作为这样：

<li><%= link_to "Home", root_path, { :class => 'top_menu_item'} %></li>

然后，在本地样式表，这是最后一个加载，我有：

.top_menu_item { 
    font-size: 100px; 
    color: black; 
}

这正确地改变的字体大小链接，我只是为了检查一切正在工作，但颜色保持灰色？我猜我的语法错了，但没有错误导致错误？

在Ruby on Rails中使用引导的好资源的指针也适用于较长时期。谢谢。

2017-06-21 Jonathan

这可能是由于特异性。当您使用开发工具时，您可以检查您的CSS是否被另一个规则覆盖。 – Gerard

你的链接样式被通过的引导风格在那里一个覆盖。选项：

查找引导的风格，并改变它（使用控制台来追踪风格链）
更彻底地指定目标作风，如：li a.top_menu_item { color: black; }，而不是你现在所拥有的。
使用!important您的设置，如：color: black !important我不要推荐这个，你应该只有当所有其他都失败了，但有时你需要做的东西。

详细了解款式优先here。

2017-06-21 06:57:12

谢谢。根据我上面提出的评论，重要的问题解决了眼前的问题。现在我会研究其他建议，尝试解决潜在的问题。 – Jonathan

好极了，如果你找到答案有帮助，我会很感激，如果你可以把它作为一个解决方案。祝你好运！ –

正如答案中所述，它不能被强调：'！important'的使用**是非常令人沮丧的。你应该尝试所有其他可以想象的解决方案，然后再** **应用'！important'。 – connexo

下面尝试..

.top_menu_item { 
    font-size: 100px; 
    color: black !important; 
} 

.top_menu_item a{ 
    color: black !important; 
}

2017-06-21 06:53:34 Kenath

根据您的第一堂课添加！重要的，修复它。谢谢！然后，我得到了我正在寻找的悬停行为： '.top_menu_item {h} {0}颜色：黑色！重要; } }' – Jonathan

'！重要'的使用是**非常不鼓励。你应该尝试所有其他可以想象的解决方案，然后再** **应用'！important'。 – connexo

回答