logo添加闪光效果css

ZJ
ZJ
2020-12-03 / 0 评论 / 221 阅读 / 正在检测是否收录...
温馨提示:
本文最后更新于2020年12月03日,已超过1479天没有更新,若内容或图片失效,请留言反馈。
#引用#
<div class="logo">内容<div>

/**logo闪光效果CSS**/
.logo:before {
 content: "";
 position: absolute;
 width: 140px;
 height: 10px;
 background-color: rgba(255, 255, 255, 0.5);
 -webkit-transform: rotate(-45deg);
 transform: rotate(-45deg);
 -webkit-animation: blink 1s ease-in 1s infinite;
 animation: blink 1s ease-in 1s infinite;
}
 
@-webkit-keyframes blink {
 from {left: 10px;top: 0;}
 to {left: 320px;top: 0;}
}
@-o-keyframes blink {
 from {left: 10px;top: 0;}
 to {left: 320px;top: 0;}
}
@-moz-keyframes blink {
 from {left: 10px;top: 0;}
 to {left: 320px;top: 0;}
}
@keyframes blink {
 from {left: -100px;top: 0;}
 to {left: 320px;top: 0;}
}
本文共 8 个字数,平均阅读时长 ≈ 1分钟
0

评论 (0)

取消