关于CSS3动画中的animation自己遇到的问题

首先是animation动画的书写
先定义@keyframes

@keyframes roll {
  0%{
    transform: rotateZ(0deg);
  }

  100%{
    transform: rotateZ(360deg);
  }
}

然后引用到animation中

.double-coin{
  color: #ff5369;
  display: inline-block;
  animation: roll 1s 4 1s backwards alternate ease-in-out; //这里的alternate是反向动画的意思,动画次数必须大于1。
}

注: 这个.double-coin元素是行内元素,必须转成行内块级元素。

你可能感兴趣的:(js)