Home  >  Article  >  Web Front-end  >  How to use css animation-fill-mode property

How to use css animation-fill-mode property

(*-*)浩
(*-*)浩Original
2019-05-28 18:06:042985browse

The animation-fill-mode attribute specifies whether the animation effect is visible before or after the animation is played.

How to use css animation-fill-mode property

Note: The attribute value is one or more fill pattern keywords separated by commas.

Syntax

animation-fill-mode : none | forwards | backwards | both;
Value
Description
none
Does not change the default behavior.
forwards
When the animation is complete, keep the last property value (defined in the last keyframe).
backwards
During the period of time specified by animation-delay, before the animation is displayed, the start property value (on the first defined in keyframes).​
both
Both forward and backward fill modes are applied.​

##Example

Specifies the fill mode for the h1 element: