将鼠标悬停在菜单项上时，更改菜单链接的背景颜色

Question

编辑：只是为了澄清，当我将鼠标悬停在菜单框而不是链接上时，我希望链接颜色发生变化。当我将鼠标悬停在它上面时，我的链接颜色已经改变了。

我可以通过截图更好地解释我的问题。光标未显示在其中。我只有主菜单标题链接到目前为止。

这就是菜单通常的样子：

这就是我希望它一直悬停在标题上时的样子：

如下所示，“主菜单”＆＃39;当我将鼠标悬停在该标题框上时，文字会消失。它只会在我将鼠标悬停在文本上时显示。在此图像中，我将光标放在主菜单框的右下角。在下一张图片中，它会悬停在文字上方。只是指出我想的显而易见的事情。

我将链接中的所有文字颜色设置为默认为黑色，悬停时为白色。 当鼠标悬停在菜单标题上时，我将其背景颜色设置为黑色。这就是问题发生的地方。

有没有办法在标题框悬停时将链接中的文本颜色设置为更改为白色，而不仅仅是在实际文本悬停时？

a{
    color: #000;
    text-decoration: none;
}
a:hover {
    color: #fff;
}

ul li:hover {
  background: #000;
  color: #fff; 
}

Answer 1

你应该可以这样做：

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

当您将鼠标悬停在列表项上时，这会以菜单项中的链接为目标。

Answer 2

为菜单项添加一类，比如menu_item，然后添加css。

.menu_item:hover {background-color:#000; color:#fff;}