📘Animations : donner vie au CSS

Une animation CSS fait évoluer un élément dans le temps. On décrit les étapes avec @keyframes, puis on les applique avec la propriété animation.

@keyframes float définit les images clés (from → to) ; animation: float 1s infinite les relie à l'élément, avec une durée et une répétition.

@keyframes float {
  from { transform: translateY(0); }
  to { transform: translateY(-12px); }
}
.badge { animation: float 1s infinite alternate; }