Un jeu interactif pour apprendre les sélecteurs CSS en sélectionnant des plats sur une table. 32 niveaux qui couvrent tous les sélecteurs, des plus simples aux plus avancés.
CSS Battle
Des défis CSS où l'objectif est de reproduire une cible visuelle avec le moins de code possible. Un excellent terrain d'entraînement pour maîtriser CSS en profondeur.
1 min de lecture
Apprentissage
CSS Battle pousse à utiliser CSS d’une façon qu’on ne fait jamais en production. C’est un jeu de golf : reproduire une image avec le moins de caractères possible. Ça oblige à connaître CSS en profondeur.
Qu’est-ce que CSS Battle ?
Une plateforme de défis CSS où tu dois reproduire une cible visuelle en écrivant du CSS. Le score dépend de la précision du rendu et de la taille du code. Des centaines de batailles disponibles, avec un classement mondial.
Points forts
- Technique CSS avancée apprise par contrainte
- Nouveau défi régulièrement
- Comparaison des solutions avec les autres participants
- Interface propre avec éditeur intégré
- Gratuit pour les défis de base
Limites
- Les techniques utilisées ne sont pas applicables en production (CSS hackery)
- Peut être frustrant si on cherche à apprendre des bonnes pratiques
- Certains défis récents sont réservés aux membres payants
Tarifs
Gratuit pour l’accès aux défis principaux. Abonnement pour débloquer tout le contenu.
Alternatives
- CSS Grid Garden - pour apprendre Grid de façon pédagogique
- Codewars - même esprit de défi, mais en JavaScript
Catégories
Commentaires
Connexion via GitHub, gratuite et sans collecte de données par ce site.
Outils connexes
Un jeu interactif pour apprendre CSS Grid en arrosant des carottes. 28 niveaux progressifs qui couvrent toutes les propriétés essentielles de Grid Layout.
Un jeu interactif pour apprendre Flexbox en guidant des grenouilles vers leurs nénuphars. 24 niveaux progressifs qui couvrent toutes les propriétés Flexbox essentielles.