Testeur de sélecteurs CSS - Tester des sélecteurs sur du HTML en ligne
Testeur de sélecteurs CSS
Testez n'importe quel sélecteur sur votre propre HTML
Comprendre le test des sélecteurs CSS
Débogage de feuilles de style
Vérifiez qu'un sélecteur cible bien les éléments attendus avant de déployer une modification CSS.
Scraping et automatisation
Testez un sélecteur sur un échantillon de HTML avant de l'utiliser dans un scraper ou un script d'automatisation de navigateur.
Apprendre les sélecteurs
Expérimentez avec les combinateurs, les pseudo-classes et les sélecteurs d'attributs pour développer votre intuition de leur fonctionnement.
Traitement local
Votre HTML et votre sélecteur ne quittent jamais votre navigateur — la correspondance s'effectue entièrement côté client.
Comment fonctionne la correspondance
Cet outil analyse le HTML que vous avez collé pour en faire un document et exécute la méthode native du navigateur querySelectorAll() dessus — exactement le même moteur de correspondance utilisé par JavaScript et CSS dans un navigateur réel. Cela signifie que toute syntaxe de sélecteur CSS valide fonctionne ici, y compris les combinateurs complexes comme ul > li:nth-child(2) ou les sélecteurs d'attributs comme [data-active="true"].
Points clés à retenir
- Moteur de correspondance natif : Utilise le véritable querySelectorAll du navigateur, pas une réimplémentation.
- Support complet des sélecteurs : Combinateurs, pseudo-classes et sélecteurs d'attributs fonctionnent tous comme prévu.
- Uniquement côté client : Toute la correspondance s'effectue localement dans votre navigateur — aucune donnée n'est jamais envoyée à un serveur.