animation
A shorthand property that applies an animation to an element. It links the element to a set of @keyframes and defines how that animation should behave.
It is documented as part of the CSS Animations specification.
Syntax
/* Usage Example */
.loader {
animation: spin 1s linear infinite;
}
@keyframes spin{
from{ transform: rotate(0deg); }
to{ transform: rotate(360deg); }
}
/* Global values */
animation: inherit;
animation: initial;
animation: revert;
animation: revert-layer;
animation: unset;
animation Browser support
Widely available
Since
2015 96% global usage
This feature is well established and works across many devices and browser versions. It has been available across browsers since 2015.
43+
16+
9+
12+