当我悬停子il时，父级ul应该改变

Question

我正在为Wordpress模板创建一个下拉菜单，我希望主菜单项具有与子项目悬停时相同的颜色。我在堆栈溢出时发现了许多类似的问题并尝试了他们的解决方案，但它们似乎并不适用于我的情况。

我认为解决方案必须是：

parent:hover child { ... }

，例如here。

我尝试对my code做同样的事情（请参阅最后一个CSS选择器），但它在这里不起作用。

Answer 1

从以下位置更新您的CSS：

#menu ul li a:hover {
    background-color: #006699;
    color: #FFFFFF;
}

要

#menu ul li:hover a {
    background-color: #006699;
}
#menu ul li a:hover {
    color: #FFFFFF;
}

jsFiddle上的更新示例。

Answer 2

你可以通过用你的小提琴替换最后一个CSS声明来获得你想要的效果：

.menu ul li:hover > a {
    background-color: #006699;
    color: #fff !important;
}