css实现无限循环的loading加载动画效果代码
代码语言:html
所属分类:加载滚动
代码描述:css实现无限循环的loading加载动画效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en" >
<head>
<meta charset="UTF-8">
<style>
div {
width: 12px;
height: 12px;
background: black;
border-radius: 50%;
position: absolute;
left: 50%;
bottom: 50%;
}
div:nth-child(0) {
background: black;
box-shadow: 0 0 20px 20px rgba(0, 85, 128, 0.03);
}
div:nth-child(1) {
background: #00070a;
box-shadow: 0 0 20px 20px rgba(0, 88, 133, 0.03);
}
div:nth-child(2) {
background: #000e14;
box-shadow: 0 0 20px 20px rgba(0, 92, 138, 0.03);
}
div:nth-child(3) {
background: #00141f;
box-shadow: 0 0 20px 20px rgba(0, 95, 143, 0.03);
}
div:nth-child(4) {
background: #001b29;
box-shadow: 0 0 20px 20px rgba(0, 99, 148, 0.03);
}
div:nth-child(5) {
background: #002233;
box-shadow: 0 0 20px 20px rgba(0, 102, 153, 0.03);
}
div:nth-child(6) {
background: #00293d;
box-shadow: 0 0 20px 20px rgba(0, 105, 158, 0.03);
}
div:nth-child(7) {
background: #003047;
box-shadow: 0 0 20px 20px rgba(0, 109, 163, 0.03);
}
div:nth-child(8) {
background: #003652;
box-shadow: 0 0 20px 20px rgba(0, 112, 168, 0.03);
}
div:nth-child(9) {
background: #003d5c;
box-shadow: 0 0 20px 20px rgba(0, 116, 173, 0.03);
}
div:nth-child(10) {
background: #004466;
box-shadow: 0 0 20px 20px rgba(0, 119, 179, 0.03);
}
div:nth-child(11) {
background: #004b70;
box-shadow: 0 0 20.........完整代码请登录后点击上方下载按钮下载查看
网友评论0