创建下拉菜单和悬停菜单时的CSS字体颜色

Question

我正试图为this website创建一个漂亮的CSS菜单。 （该域名只是一个沙箱，而不是我打算使用设计页面的实际网站！）

正如您可能看到的那样，顶部有一个CSS菜单。当你将鼠标悬停在其中一个部分上时，它会很好地下降，但是子菜单文本保持黑色，而不是我想要的#CCC（灰色）颜色 - 出于美学原因我需要黑色的悬停字体颜色。我检查了Google Chrome（F12）的Inspector部分中当前的CSS样式，并且该部分的#CCC部分已被删除。据我所知，这意味着它已被覆盖，但我不知道是什么......

如果有人在他们的浏览器中有类似的代码功能，我会非常感激，如果你可以检查它。我自己制作了菜单，所以我想我可以编码，但我无法理解什么是字体颜色。我认为它是new_menu_style.css文件的第73行。

Answer 1

您应该尝试将其添加到CSS：

.menu ul li:hover ul li a {
    color: #ccc;
}
.menu ul li:hover ul li a:hover {
    color: black;
}

.menu ul li:hover a获得的权重高于另一个，覆盖它。

Answer 2

首先：对你的代码风格做点什么。适当的缩进会增加可读性：

所以这是一个解决方案：将其添加到您的CSS中，因为它们会覆盖.menu ul li:hover a

.menu ul li:hover ul a {
    color:#ccc
}
.menu ul li:hover ul li:hover a {
    color:#000
}