CSS Diner

CSS Diner, Un jeu interactif pour apprendre les sélecteurs CSS en sélectionnant des plats sur une table. Et quelques alternatives.

1 min de lecture Apprentissage
CSS Diner
Accéder à l'outil GratuitAvis

CSS Diner rend les sélecteurs CSS amusants. 32 niveaux pour passer des sélecteurs de base aux pseudo-classes avancées, avec un rendu visuel immédiat à chaque fois.

Qu’est-ce que CSS Diner ? #

Un jeu éducatif où tu dois sélectionner des éléments sur une table de restaurant en écrivant des sélecteurs CSS. Chaque niveau introduit un nouveau type de sélecteur, des plus courants aux plus pointus.

Sélecteurs couverts : balises, classes, IDs, descendants, enfants directs, siblings, pseudo-classes (:first-child, :nth-child, :not…), attributs…

Points forts #

  • Couverture complète des sélecteurs CSS
  • Rendu visuel clair, tu vois ce que tu sélectionnes en temps réel
  • Référence du sélecteur affichée à chaque niveau
  • Aucune installation, tout dans le navigateur
  • Gratuit et open-source

Limites #

  • Pas de sélecteurs CSS récents (:is(), :where(), :has())
  • Interface un peu datée

Tarifs #

Gratuit.

Alternatives à CSS Diner #

Cet outil mérite votre avis Votez en haut de page pour aider d'autres lecteurs à le découvrir.

Catégories

Commentaires

Connexion via GitHub, gratuite et sans collecte de données par ce site.

Outils connexes