css闪烁效果
作者:互联网
纯css闪烁效果demo
具体速度和颜色自己可以自己调
<div class="father-box">
<div class="header-box">
</div>
</div>
@keyframes test {
from {
opacity: 1.0;
}
50% {
opacity: 0.4;
}
to {
opacity: 1.0;
}
}
@-webkit-keyframes test {
from {
opacity: 1.0;
}
50% {
opacity: 0.4;
}
to {
opacity: 1.0;
}
}
.father-box {
position: relative;
}
.header-box {
color: #fff;
padding: 10px;
font-size: 15px;
height: 300px;
background-color: rgba(146, 139, 139, .8);
animation: test 1000ms infinite;
-webkit-animation: test 1000ms infinite;
}
效果
![](https://www.icode9.com/i/ll/?i=956802dbbebd4bbebc97b48135439595.png)
![](https://www.icode9.com/i/ll/?i=208cf6b73d5f417c84cfcb0d0186b4d2.png)
标签:opacity,1.0,效果,color,0.4,keyframes,test,闪烁,css 来源: https://www.cnblogs.com/tianmiaogongzuoshi/p/16487978.html