css悬停元素来显示孩子，当我将鼠标悬停在孩子身上时，如何将悬停css保留在父母身上？

Question

我有一个带有几个<li>元素的<ul> 。 在<li>元素内部有一个默认隐藏的大<div> 。 当我悬停<li>它的背景会像底部边框一样改变颜色，也会显示<div> 。 这是预期的行为。 注意我使用css而不是javascript来悬停效果。 .menuItem:hover .menuBody { display:block;} 。 我的问题是，当我将鼠标悬停在现在显示的<div>其父级时，在这种情况下<li>会丢失它的悬停样式。 当我将鼠标悬停在<div>时，如何强制父母保留悬停样式？ 菜单的基本html是这样的。 任何帮助或提示当然是值得赞赏的。

<ul>
    <li class="menuItem">
        <a href="#">MenuItem</a>
        <div class="menuBody></div>
    </li>
</ul>

Answer 1

你问的实际上是默认行为。 当您将鼠标悬停在子项上时，父项也会收到悬停状态，并且仍应显示悬停css。 看看这个例子：

http://jsfiddle.net/jxZ6S/

我们需要更多代码来查看究竟是什么问题。 您确定要将悬停样式应用于父级，而不是a吗？