先看看效果图:
CSS Code复制内容到剪贴板 #loader1, #loader1:before, #loader1:after { background: #f2fa08; -webkit-animation: load1 1s infinite ease-in-out; animation: load1 1s infinite ease-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: 50px 50px; 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-keyframes load1 { 0%, 80%, 100% { box-shadow: 0 0 #f2fa08; height: 4em; } 40% { box-shadow: 0 -2em #f2fa08; height: 5em; } } @keyframes load1 { 0%, 80%, 100% { box-shadow: 0 0 #f2ff08; height: 4em; } 40% { box-shadow: 0 -2em #f2ff08; height: 5em; } }以上就是本文的全部内容,希望对大家的学习有所帮助。