CSS3绘制超炫的上下起伏波动进度加载动画
2021-05-08 21:13:35 先看看效果图:
CSS Code复制内容到剪贴板
#loader1,#loader1:before,#loader1:after{background:#f2fa08;-webkit-animation:load11sinfiniteease-in-out;animation:load11sinfiniteease-in-out;width:1em;height:4em;}#loader1:before,#loader1:after{position:absolute;top:0;content:'';}#loader1:before{left:-1.5em;}#loader1{text-indent:-9999em;margin:50px50px;position:relative;float:left;font-size:11px;-webkit-animation-delay:0.16s;animation-delay:0.16s;}#loader1:after{left:1.5em;-webkit-animation-delay:0.32s;animation-delay:0.32s;}@-webkit-keyframesload1{0%,80%,100%{box-shadow:00#f2fa08;height:4em;}40%{box-shadow:0-2em#f2fa08;height:5em;}}@keyframesload1{0%,80%,100%{box-shadow:00#f2ff08;height:4em;}40%{box-shadow:0-2em#f2ff08;height:5em;}}以上就是本文的全部内容,希望对大家的学习有所帮助。
声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。 如涉及版权问题,请提交至online#300.cn邮箱联系删除。