{ animation-duration 【 アニメーション・デュレーション 】 : 時間; }

animation-durationプロパティは、アニメーションが開始されてから完了するまでの時間を指定します。

初期値	0s
継承	なし
適用される要素	すべての要素、:before、:after疑似要素
モジュール	CSS Animations Module Level 3

値の指定方法

時間

任意の数値＋単位	アニメーション1回の時間を単位付きの数値で指定します。

CSSにおける単位付きの数値の指定方法

サンプルコード

＠keyframes規則の使用例も併せて参照してください。

.box{
  background: #6cb371;
  animation-name: bnr-animation;
  animation-duration: 10s;
}