本文介绍了在悬停时显示特定的div?仅使用 css 和 html的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着跟版网的小编来一起学习吧！
问题描述
我想显示第二个 div(在 HTML 中)，类 dikha 将光标悬停在锚标记上.
I want to show second div (in HTML) with class dikha on cursor hover over anchor tag.
HTML 代码:
<a>Hover over me!</a>
<div class="faraz"> sdjfg </div>
<div class="dikha">Stuff shown on hover</div>
风格
div {
display: none;
}
a:hover > div:nth-child(2) {
display: block;
background-color: RED;
height: 250px;
width: 960px;
}
推荐答案
需要使用相邻兄弟选择器~.此外，您要显示的 div 是第三个孩子，而不是第二个(因为 <a> 是第一个).
You need to use the adjacent siblings selector ~. Also, the div you want to show is the third child, not the second (because the <a> is the first).
div {
display: none;
}
a:hover ~ div:nth-child(3) {
display: block;
background-color: RED;
height: 250px;
width: 960px;
}
演示:http://jsfiddle.net/3eFhf/
这篇关于在悬停时显示特定的div?仅使用 css 和 html的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持跟版网！
本站部分内容来源互联网,如果有图片或者内容侵犯了您的权益，请联系我们，我们会在确认后第一时间进行删除！