好创意的设计网站,河北众成建设有限公司网站,上海闵行是郊区吗,品牌展示型网站有哪些如何使用css实现一个加载动画 有四个点 初始化为同一个颜色 每个阶段 不同的透明度 刷新也不会影响初始化
!DOCTYPE html
html langen
headmeta charsetUTF-8meta nameviewport contentwidthd…如何使用css实现一个加载动画 有四个点 初始化为同一个颜色 每个阶段 不同的透明度 刷新也不会影响初始化
!DOCTYPE html
html langen
headmeta charsetUTF-8meta nameviewport contentwidthdevice-width, initial-scale1.0titleDocument/title
/head
body
div classloading-containerdiv classloading-dot dot1/divdiv classloading-dot dot2/divdiv classloading-dot dot3/divdiv classloading-dot dot4/div
/div
/body
style/*加载动画开始*/.loading-container {padding: 5px 0;position: relative;}.loading-dot {width: 7px;height: 7px;border-radius: 50%;margin: 0 3px;background: #327eff;animation: loading 3s infinite;float: left;}.dot1 {animation-delay: -1.5s;}.dot2 {animation-delay: -1s;}.dot3 {animation-delay: -0.5s;}.dot4 {animation-delay: 0s;}keyframes loading {0% {opacity: 0.25;}50% {opacity:1;}100% {opacity: 0.25;}}/*加载动画结束*/
/style
/html
