プログラミング

transition-delayでトランジションの変化開始までの時間を指定【CSS】

transition-delayプロパティは、トランジション効果が開始されるまでの時間を指定するプロパティです。

{transition-delay: 時間;}

指定した時間が経過すると、変化が開始されます。

transition-delayの値の指定方法

transition-delayプロパティでは、変化が開始されるまでの時間を数値で指定します。

単位にはs(秒)、ms(ミリ秒)を使うことができ、初期値として0が指定されていますが、これはすぐに変化が開始されるということです。

次の例では、transition-delayプロパティで2sを指定しているので、2秒後に変化が開始します。

{transition-delay: 2s;}
マウスオーバーして2秒後に背景色と文字色が変わります。

Leave a Comment