css实现hover划过（滑过）图片闪光（亮光一闪而过）效果
css实现hover划过（滑过）图片闪光（亮光一闪而过）效果，代码如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<title>css实现滑过图片闪光效果</title>
<style>
.item{
width:100px;
height:100px;
background: #f00;
position:relative;
}
.item::before{
content:'';
position:absolute;
left:0;
top:0;
right:0;
bottom:0;
background:linear-gradient(-45deg,transparent 30%,transparent,rgba(255,255,255,.5),transparent 70%) no-repeat;
background-size:200% 200%;
background-position:200% 200%;
}
.item:hover::before{
transition:background-position 1s;
background-position:-100% -100%;
}
</style>
</head>
<body>
<div class="item">
</div>
</body>
</html>转载请注明出处：php程序员的笔记
最后修改时间：2024年04月01日 09时11分 文章来源：yuhaomiao