The @keyframes
rule controls the intermediate steps in the CSS animation sequence by defining styles for keyframes of the animation sequence.
This gives more control over the intermediate stages of the animation sequence than transitions.
@keyframes keyframes-name {
keyframe-block-list
}
where
keyframes-name = custom-ident | string
keyframe-block-list = keyframe-block+
where
keyframe-block = keyframe-selector# {
declaration-list
}
where
keyframe-selector = from | to | percentage