CSS3实现粒子旋转伸缩加载动画

2020-05-11 18:28:50易采站长站整理

                -0.11em -0.83em 0 -0.477em #ff0000;     
    }     
  5%,     
  95% {     
    box-shadow: -0.11em -0.83em 0 -0.4em #ff0000, -0.11em -0.83em 0 -0.42em #ff0000,     
                -0.11em -0.83em 0 -0.44em #ff0000, -0.11em -0.83em 0 -0.46em #ff0000,     
                -0.11em -0.83em 0 -0.477em #ff0000;     
  }     
  30% {     
    box-shadow: -0.11em -0.83em 0 -0.4em #ff0000, -0.51em -0.66em 0 -0.42em #ff0000,     
                -0.75em -0.36em 0 -0.44em #ff0000, -0.83em -0.03em 0 -0.46em #ff0000,     
                -0.81em 0.21em 0 -0.477em #ff0000;     
  }     
  55% {     
    box-shadow: -0.11em -0.83em 0 -0.4em #ff0000, -0.29em -0.78em 0 -0.42em #ff0000,     
                -0.43em -0.72em 0 -0.44em #ff0000, -0.52em -0.65em 0 -0.46em #ff0000,     
                -0.57em -0.61em 0 -0.477em #ff0000;     
  }     
  100% {     
    -webkit-transform: rotate(360deg);     
    transform: rotate(360deg);     
    box-shadow: -0.11em -0.83em 0 -0.4em #ff0000, -0.11em -0.83em 0 -0.42em #ff0000,     
                -0.11em -0.83em 0 -0.44em #ff0000, -0.11em -0.83em 0 -0.46em #ff0000,     
                -0.11em -0.83em 0 -0.477em #ff0000;