Pour cet exercice vous devez recréer un motif à partir de tuiles contenant des formes, comme dans le célèbre jeu de scociété Q-bitz. Cependant, les formes sont actuellement toutes carrées. Vous devrez donc les ajustés en CSS afin de vous permettre d’arriver à vos fins.
Aperçu du résultat 👇
Matériel
Pen de départ
Requis
Créez une 1re classe vous permettant de faire disparaitre un élément et appliquez là dans le code HTML a toute les formes de tuile devant être invisibles.
Créez une 2e classe permettant de générer un cercle parfait et attribuez cette classe aux formes des tuiles dans le coin supérieur droit ↗️ et inférieur gauche ↙️.
Faites de même pour toutes les formes présentes sur le jeu afin de reconstituer le motif fourni en guise d'aperçu ☝️.
Une fois terminé, vous devriez avoir écrit 9 règles CSS, n’ayant toutes qu’une seule propriété, soit border-radius.
Notes de cours