0
点赞
收藏
分享

微信扫一扫

纯css闪烁效果demo

一ke大白菜 2022-07-18 阅读 144

纯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;
}

效果

纯css闪烁效果demo_css

纯css闪烁效果demo_css闪烁_02

举报

相关推荐

0 条评论