Mémo
// Le transform permet d'effectuer une transformation 2D et 3D sur un élément
transform:
rotate(180deg);
// Défini le degré de rotatation
transform:
translate(1rem, -1rem);
// Défini le décalage sur l'axe vertical et horizontal
transform: scale(1.25);
// Défini la taille de l'élément sur 1.25 fois sa taille (+25%)
transform:
rotate(180deg) translate(1rem, -1rem)
scale(1.25);
// Pour appliquer plusieurs transformations avec la propriété transform, il faut les mettre à la suite
1️⃣ Transformer un élément
La première boîte doit avoir une rotation de 180 degrés, avec une taille réduite de 25%. La deuxième boîte doit avoir un déplacement de -5rem vers la droite et -5rem vers le haut. Toutes ces transformations se font uniquement la propriété transform.
Effectuer ces transformations uniquement lors du hover (cf. #N11 · Hover).
Ajouter une transition lors du hover (cf. #N13 · Transitions).
Lorem ipsum
Lorem ipsum
🎯 Résultat attendu

Effectuer ces transformations uniquement lors du hover (cf. #N11 · Hover).

Ajouter une transition lors du hover (cf. #N13 · Transitions).
