CSS呼吸灯效果

<html>

<head>

</head>
<body>
<div class="arrow_box">按按</div>
</body>
<style>
.arrow_box
{
width:40px;
height:40px;
animation: glow 800ms ease-out infinite alternate; 
}
@keyframes glow {
    0% {
        border-color: #393;
        box-shadow: 0 0 5px rgba(0,255,0,.2), inset 0 0 5px rgba(0,255,0,.1), 0 1px 0 #393;
    }
    100% {
        border-color: #6f6;
        box-shadow: 0 0 20px rgba(0,255,0,.6), inset 0 0 10px rgba(0,255,0,.4), 0 1px 0 #6f6;
    }
}
</style>
</html>

来源：https://www.cnblogs.com/winchance/p/11897165.html

标签

呼吸灯

css

易学教程内所有资源均来自网络或用户发布的内容，如有违反法律规定的内容欢迎反馈！
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!