#loading {
background-color:#000000;
height:100%;
width:100%;
position:fixed;
z-index:1;
margin-top:0px;
top:0px;
}
#loading-center {
position:absolute;
left:35%;
top:35%;
height:200px;
width:200px;
}
.round {
border-radius:50% 50% 50% 50%;
/*从半角到圆弧*/
position:absolute;
border-top:3px solid #ffff00;
border-left:5px solid #ffffff;
border-bottom:5px solid transparent;
border-right:5px solid transparent;
animation:animate 3s infinite;
}
#round_one {
left:75px;
top:75px;
width:50px;
height:50px;
}
#round_two {
left:65px;
top:65px;
width:70px;
height:70px;
animation-delay:0.2s;
}
#round_three {
left:55px;
top:55px;
width:90px;
height:90px;
animation-delay:0.4s;
}
#round_four {
left:45px;
top:45px;
width:110px;
height:110px;
animation-delay:0.6s;
}
@keyframes animate {
50% {
transform:rotate(360deg) scale(0.8);
}
}直接复制到自己的html和css文件即可使用