如何在CSS中保持鼠标悬停在子元素上时父元素的悬停样式？

Question

3

我有一个包含多个

元素的

元素内都有一个默认隐藏的大
。当我将鼠标悬停在
上时，背景颜色和底部边框会改变，并显示
。这是期望的行为。注意，我使用的是css而不是javascript实现悬停效果。.menuItem:hover .menuBody { display:block;}。我的问题是，当我悬停在此时正在显示的
上时，它的父元素-即
失去了悬停样式。如何使父元素在我悬停在
上时保持悬停样式？菜单的基本html如下。欢迎提供任何帮助或提示。
```
<ul>
    <li class="menuItem">
        <a href="#">MenuItem</a>
        <div class="menuBody></div>
    </li>
</ul>
```

- Hcabnettek

请提供您的代码，让我来试试。 - Abhitalks

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Pevara · Accepted Answer

您所询问的实际上是默认行为。当您悬停在子元素上时，父元素也会接收到悬停状态，并且悬停CSS应该仍然显示。请看这个示例：http://jsfiddle.net/jxZ6S/。

我们需要更多的代码来看看到底出了什么问题。您确定您将hover样式应用于了父元素，而不是标签吗？