最終更新日

animation-nameプロパティ

animation-nameは、適用するアニメーションの名前を指定するプロパティです。

値に指定する名前は、@keyframesで設定したアニメーションIDと同じものです。カンマで区切って複数のアニメーションIDを指定できます。アニメーション名の代わりに「none」を指定した場合、アニメーションは適用されません。

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

CSS3での変更点
・animation-nameは、CSS3から新しく追加されたプロパティです。
初期値 適用先 継承
none ブロックレベル要素、インラインレベル要素 なし
説明
none アニメーションは適用されません。(初期値
アニメーション名 @keyframesで設定したアニメーションIDを指定します。カンマで区切って複数のアニメーションIDを指定可能です。
サンプルコード
animation-name: none;
animation-name: anime1;
animation-name: anime1, anime2;
参考文献:CSS Animations外部リンク
HOME