¿Qué son las animaciones CSS?

Las animaciones CSS permiten transicionar propiedades de un estado a otro usando @keyframes y la propiedad animation, sin necesidad de JavaScript.

---

Ejemplo 1 – Sintaxis abreviada (animation)

Usa la propiedad abreviada animation para definir nombre, duración, función de tiempo, retardo, iteraciones y dirección en una sola línea.

---

Ejemplo 2 – Propiedades individuales (animation-*)

Usa las propiedades individuales: animation-name, animation-duration, animation-timing-function, animation-delay, animation-iteration-count y animation-direction.