div+css实现圈圈放大动画效果代码
代码语言:html
所属分类:动画
代码描述:div+css实现圈圈放大动画效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <style> body { background-color: #222; height: 100vh; } #pulse-loader .pulse-loader-1, #pulse-loader .pulse-loader-2 { -webkit-border-radius: 1000px; -moz-border-radius: 1000px; -o-border-radius: 1000px; border-radius: 1000px } #pulse-loader { position: fixed; z-index: -9999; left: 50%; top: 50%; width: 300px; height: 300px; margin-left: -150px; margin-top: -150px } #pulse-loader { top: 45% } #pulse-loader>div { position: absolute; top: 0; left: 0; right: 0; bottom: 0; border-width: 20px; border-style: solid; border-color: #fff } #pulse-loader .pulse-loader-1 { -webkit-animation: pulse1 1s .5s ease infinite; -moz-animation: pulse1 1s .5s ease infinite; -ms-animation: pulse1 1s .5s ease infinite; -o-animation: pulse1 1s .5s ease infinite; animation: pulse1 1s .5s ease infinite } #pulse-loader .pulse-loader-2 { -webkit-animation: pulse1 1s ease infinite; -moz-animation: pulse1 1s ease infinite; -ms-animation: pulse1 1s ease infinite; -o-animation: pulse1 1s ease infinite; animation: pulse1 1s ease infinite }.........完整代码请登录后点击上方下载按钮下载查看
网友评论0