CSS3 animation-delay プロパティ

2 秒待ってから、アニメーションを開始します：

div {
-webkit-animation-delay: 2s; /* Chrome, Safari, Opera */
animation-delay: 2s;
}

他の "Try it Yourself" の例が下にあります。

定義と用法

animation-delay プロパティは、アニメーションが開始するまでの待機時間を指定します。

animation-delay の値は、秒（s）またはミリ秒（ms）で定義します。

デフォルト値：	0s
継承：	継承する
アニメーション可否：	不可。animatable を参照
バージョン：	CSS3
JavaScript 構文：	object.style.animationDelay="1s" Try it

表中の数字は、完全にプロパティをサポートした最初のブラウザのバージョンです。

-webkit-、-moz-、-o- の後に続く数字は、接頭辞付きで動作した最初のバージョンです。

プロパティ
animation-delay	43.0 4.0 -webkit-	10.0	16.0 5.0 -moz-	9.0 4.0 -webkit-	30.0 15.0 -webkit- 12.0 -o-

animation-delay: time|initial|inherit;

値	説明	Play it
time	任意。アニメーションの開始前に待機する秒またはミリ秒数を定義します。デフォルト値は 0 です。マイナス値の指定ができます	Play it ❯
initial	プロパティにデフォルト値を設定します。initial を参照
inherit	このプロパティは親要素を継承します。inherit を参照

マイナスの値を使用すると、アニメーション開始の 2 秒後からアニメーションが始まることに注意してください：

div {
-webkit-animation-delay: -2s; /* Chrome, Safari, Opera */
animation-delay: -2s;
}