The keyframes rule and CSS animation properties
Occasionally, enhancing user experience throughout their journey with our app necessitates incorporating more intricate animations. Therefore, let’s delve deeper into understanding animation properties and the @keyframes rule.
To create a CSS animation sequence, we style the element we want to animate with the animation property or its sub-properties. This allows us to configure the timing, duration, and other details of how the animation sequence should progress.
However, it’s important to note that this setup doesn’t directly influence the visual appearance of the animation, as that aspect is controlled by the @keyframes rule.
The following are CSS animation properties and their shorthands:
|
Property |
Values accepted |
Description |
|
animation (shorthand) |
Set... |
