CSS3 animation动画，循环间的延时执行该怎么弄？

Question

如下代码，其中的delay值为3s，但是animation按现在的规则，这个delay是指动画开始前的延时，在动画循环执行间，这个delay是不生效的。 {代码...}

大家讲道理 · Answer

.item{
  webkit-animation: revolving 4s 0s infinite;
  animation: revolving 4s 0s infinite;
}
@-webkit-keyframes revolving{
  0,75%{
    -webkit-transform: perspective(700px) rotateX(90deg);
  }
  87.5%{
    -webkit-transform: perspective(700px) rotateX(0deg);
  }
  100%{
    -webkit-transform: perspective(700px) rotateX(-90deg);
  }
}

Set the total animation to 4 seconds, then the first 75%, which is 3 seconds, will not change (0-75%), and the next 25%, which is 1 second, will be animated.