我有下一个情况/菜单：http://inturnets.com/test/
这是一个WordPress生成的菜单结构。
请将鼠标悬停在“菜单＃1”上。当鼠标悬停时，我需要菜单＃1，菜单＃1 - 1和菜单＃1 - 2看起来像http://inturnets.com/test/images/whatineed.jpg
它有一个具有渐变效果的背景图像。它应该从菜单顶部开始，从菜单＃1的顶部开始，到子菜单UL的LI的结尾。当bg图像结束（不重复）时，应该从底部的最后一个像素继续颜色。在我们的示例中，为了获得更好的视觉体验，我们来看看＃ff0000：）
有没有人知道如何解决这个问题？
现在我尝试了下一个css代码：
#menu-top-navigation ul:hover { background: url(images/bg-menutest.jpg) repeat-x center top; }
但正如你所看到的那样，只有悬停才能覆盖LI。我的意思是子菜单UL。我认为我们需要一个悬停LI的悬停规则，一些带半径的圆角和另一个带有圆角半径的子菜单UL的悬停规则，并从顶部到底部看起来具有连续性，就像它在链接图像上看起来一样。
答案 0 :(得分：3)
尝试使用选择器指定背景颜色，如下所示：
#menu-top-navigation > li:hover
这样，您应该能够为整个LI内容指定一个渐变（在您的情况下为UL和LI）。强烈建议使用CSS3渐变。
如果这不会有帮助，您可能需要在渐变上指定
#menu-top-navigation > li:hover {gradient color of XXX to YYY}
和一个
#menu-top-navigation > li:hover > ul {gradient color of YYY to ZZZ}
注意：渐变规范只是一个例子，它不是实际的语法。只是想让自己更容易理解。
如果您有任何问题，请与我们联系。