CSS | animation-iteration-count 属性

CSS 中的 animation-iteration-count 属性用于设置动画重复播放的次数。

语法

animation-iteration-count: number|infinite|initial|inherit;

• number：指定动画播放的次数，可以是正整数、小数和负数。例如：2、0.5、-1。
• infinite：表示动画无限次播放。
• initial：将属性设置为它的默认值。
• inherit：从父元素继承该属性的值。

例子

以下实例演示如何使用 animation-iteration-count 属性：

/* 播放 3 次 */
div {
  animation-name: example;
  animation-duration: 2s;
  animation-iteration-count: 3;
}

/* 无限次播放 */
div {
  animation-name: example;
  animation-duration: 2s;
  animation-iteration-count: infinite;
}

浏览器支持

animation-iteration-count 属性在以下浏览器中受支持：

• Chrome
• Firefox
• Safari
• Opera
• IE 10+
• Edge

总结

animation-iteration-count 属性用于设置动画的播放次数。可以指定播放次数的数值，也可以设置为无限播放。