最終更新日

animation-iteration-countプロパティ

animation-iteration-countは、アニメーションの再生回数を指定するプロパティです。

アニメーションを繰り返し再生する回数を指定します。初期値は「1」で、この場合アニメーションは1回のみ再生されます。「infinite」を指定した場合、アニメーションは無限に繰り返されます。適用対象のアニメーションを複数指定した場合、animation-iteration-countの値も、カンマで区切って複数指定できます。

アニメーション関連のプロパティをまとめて指定する場合は、animationを使用します。

CSS3での変更点
・animation-iteration-countは、CSS3から新しく追加されたプロパティです。
初期値 適用先 継承
1 すべての要素、::before擬似要素セレクタ::after擬似要素セレクタ なし
説明
infinite アニメーションを無限に繰り返します。
数値 再生回数を指定します。
サンプルコード
animation-iteration-count: infinite;
animation-iteration-count: 2;
animation-iteration-count: 2, 5;
animation-iteration-count: 2, 5, 10;
参考文献:CSS Animations外部リンク
HOME