animation-fill-modeを使ってCSSアニメーションの実行前後のスタイルを指定する方法｜DAD UNION – エンジニア同盟この記事では、animation-fill-modeプロパティを使って、CSSアニメーションの開始前と終了後のスタイルを指定する方法をご紹介します。 アニメーションのタイミングや動きだけでなく、開始前と終了後の見た目を自在にコントロールできるこのプロパティを使いこなすことで、より洗練されたウェブデザインを作り出すことができます。 animation-fill-modeは4つ指定可能 none（デフォルト） animation-fill-modeのデフォルト値であり、アニメーションの実行前後に特別なスタイルを適用しません。したがって、アニメーションが適用されていない通常の状態で表示されます。 backwards アニメーション開始待ち時間「animation-delay」、「@keyframes」の開始「0%」の状態が適用される。 アニメーション終了時「@keyframes」は適用されない。
