加载动态效果（三点变化）-3

来源：互联网发布：plc编程下载编辑：程序博客网时间：2024/06/06 04:41

.loader{font-size: 20px;width: 1em;height: 1em;border-radius: 50%;position: relative;text-indent: -9999em;box-shadow: 1em 2em 0 .5em #FFF,4em 2em 0 .5em #FFF,7em 2em 0 .5em #FFF;animation: load-effect 2s infinite linear;-webkit-animation: load-effect 2s infinite linear;;}@-webkit-keyframs load-effect{0%{box-shadow: 1em 2em 0 .5em #fff,4em 2em 0 0 #fff,7em 2em 0 -0.5em #fff;}25%{box-shadow: 1em 2em 0 0 #fff,4em 2em 0 -.5em #fff,7em 2em 0 0 #fff;}50%{box-shadow: 1em 2em 0 -0.5em #fff,4em 2em 0 0 #fff,7em 2em 0 0.5em #fff;}75%{box-shadow: 1em 2em 0 0 #fff,4em 2em 0 0.5em #fff,7em 2em 0 0 #fff;}100%{box-shadow: 1em 2em 0 0.5em #fff,4em 2em 0 0 #fff,7em 2em 0 -0.5em #fff;}}@keyframes load-effect{0%,100%{box-shadow: 1em 2em 0 .5em #fff,4em 2em 0 0 #fff,7em 2em 0 -0.5em #fff;}25%{box-shadow: 1em 2em 0 0 #fff,4em 2em 0 -.5em #fff,7em 2em 0 0 #fff;}50%{box-shadow: 1em 2em 0 -0.5em #fff,4em 2em 0 0 #fff,7em 2em 0 0.5em #fff;}75%{box-shadow: 1em 2em 0 0 #fff,4em 2em 0 0.5em #fff,7em 2em 0 0 #fff;}}loading...

阅读全文

0 0