css3特效2 放射性圆形

.spinner {
  width: 400px;
  height: 400px;
  background-color: #0cf;
 
  border-radius: 100%; 
  -webkit-animation: scaleout 1.0s infinite ease-in-out;
}
 
@-webkit-keyframes scaleout {

  0% {
     -webkit-transform: rotateX(45deg) scale(0.0);
  }
  100% {
    -webkit-transform: rotateX(45deg) scale(1.0);
    opacity: 0;
  }
}

 

<div class="spinner"></div>