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

Question

我有<ul>几个<li>元素.在<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？