仅使用CSS，将鼠标悬停时显示div

当有人将鼠标悬停在<a>元素上时，我想显示一个div ，但是我想在CSS中而不是在JavaScript中执行此操作。您知道如何实现吗？

您可以执行以下操作：

div {
    display: none;
}
a:hover + div {
    display: block;
}
<a>Hover over me!</a>
<div>Stuff shown on hover</div>

这使用相邻的兄弟选择器，是the下拉菜的基础。

HTML5允许锚元素包装几乎所有内容，因此在这种情况下，该div元素可以成为锚的子元素。否则原理是相同的-使用:hover伪类更改display另一个元素的属性。