一个无法言语的坑

最新推荐文章于 2024-10-22 19:27:51 发布

原创最新推荐文章于 2024-10-22 19:27:51 发布 · 249 阅读

0 ·

CC 4.0 BY-SA版权

本文讲述了在网站开发中遇到的一个关于CSS样式重叠导致hover效果闪烁的问题，并分享了解决方案及CSS hover的一些使用技巧。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

今天做一个hover效果的小需求

因为样式改了一下午，最后发扬样式重叠了导致onmouseover之后一直闪屏，

这件事情深刻的提醒我css样式在我们网站开发过程中也是很重要的

。我的问题就是定位

当我onmouseover的时候div显示，，但是放上去之后有时候会闪烁，以为是js的问题最后才发现是css的问题，我的显示的css覆盖了onmouerover的元素所以就造成了闪烁

顺便补充一点

hover css的一个小知识，在我们hover同级或者是子级元素的时候是可以按照常规写的，同级写个 + 就行了但是如果是不同级，不是子级的元素hover是不起效果的

<!DOCTYPE>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style>

.hoverfa:hover{
	color:red;
}
.hoverfa:hover a{
	display: block;
}
a{
	display: none
}
.hoverfa:hover + .hoverfa1{ background:#FC6;}
</style>
</head>


<body>
<div>
<div class="hoverfa">
nnnnn
<a>aaaaa</a>
</div>
<div class="hoverfa1">
扎根发放卡时间放假啊咖啡机卡咖啡机卡
</div>

</div>

</body>
</html>