CSS悬停颜色不起作用

Question

使用此代码段：

#navigation li:hover > #navigation li a {
    color:white;
}

将鼠标悬停在li元素上，文字的颜色应该变为白色，但事实并非如此。有人可以帮忙吗？

Answer 1

您需要包含HTML才能获得更准确的答案，但我认为这样可以解决问题。

#navigation li:hover > a {
    color:white;
}

Answer 2

你只需要这个：

#navigation li:hover > a {

或

#navigation li > a:hover {

无需在伪选择器之后再次重写secuence！

Answer 3

没有看到html这有点刺，但我的猜测是你的文字在一个标签内。因此，你需要设计一个而不是li的样式。 E.g。

#navigation li:hover > a {
    color:white;
}

如果您可以发布一个非常有用的代码链接！ ： - ）

Answer 4

你这样做是错误的。

解决方案取决于您当前的标记结构。

假设<a>元素嵌套在<li>个元素中，您可以按如下方式选择链接：

#navigation li:hover a {
    color:white;
}

如果要在导航中选择第一级<li>元素，则应使用children selector执行此操作：

#navigation > li:hover a { /* select the li child the look for the anchors */
    color:white;
}

最后，为了选择子<a>元素，您可以使用以下内容：

#navigation li:hover > a { /* select li and look for the child anchors */
    color:white;
}

Answer 5

有点像

#navigation li a:hover {color: #fff;}

不再适合您的需求？代码输出更少？