Proprietà animation

Definizione

La proprietà CSS animation definisce l'animazione grafica che un elemento deve eseguire. La proprietà raggruppa tutte le proprietà di tipo animazione nell'ordine mostrato nella sezione "Esempio"

La sintassi è la seguente:

animation:
{animation‑name}
{animation‑duration}
{animation‑timing‑function}
{animation‑delay}
{animation‑iteration‑count}
{animation‑direction}
{animation‑fill‑mode}
{animation‑play‑state}

animation

proprietà CSS

Definisce i parametri dell'animazione di un elemento o selettore

Esempio

animation: 3s ease-in 1s infinite normal both running slidein;

Compatibilità

Tutti i moderni browser supportano questo elemento.

Approfondimento

Le animazioni necessitano di essere create attaverso keyframes, come nell'esempio in basso:

@keyframes scale-up {
  0% {
            transform: scale(0.5);
  }
  100% {
            transform: scale(1);
  }
}