Formateur de CSS
Formatez le CSS en conservant sélecteurs, déclarations, commentaires, valeurs et structure des règles at-rule.
Make CSS easier to review
Un CSS compact peut cacher sélecteurs, déclarations, commentaires et longues valeurs sur une ligne. Le formateur affiche une structure lisible.
Le formatage change la présentation et ne prouve ni validité, ni efficacité, ni accessibilité, ni compatibilité. Gardez la source et contrôlez un diff.
Utilisez un exemple avec sélecteurs, déclarations, commentaires, custom properties, media queries et valeurs citées.
Formatting is not CSS validation
CSS comprend sélecteurs, déclarations, valeurs, commentaires, at-rules, fonctions, custom properties et blocs. L’indentation en montre les limites.
Le formateur organise espaces et tokens mais ne prouve ni standard, ni spécificité, ni accessibilité, ni performance, ni compatibilité du build.
Les valeurs peuvent contenir chaînes, URLs, escapes, gradients, variables et extensions fournisseur; préservez-les et testez la cible.
How to format CSS
- Collez une feuille CSS complète ou un fragment compatible.
- Examinez sélecteurs, accolades, déclarations, commentaires, propriétés personnalisées, fonctions et at-rules.
- Comparez propriétés, valeurs, guillemets, URLs, variables et ordre avec la source.
- Lancez linter, build, accessibilité et tests navigateur.
- Retirez URLs privées, tokens et données utilisateur des exemples.
Formatting method
- Lit sélecteurs, déclarations,
Lit sélecteurs, déclarations, valeurs, commentaires, blocs, fonctions et at-rules.
- Ajoute retours et
Ajoute retours et indentation pour examiner règles et blocs imbriqués.
- Conserve valeurs, chaînes,
Conserve valeurs, chaînes, URLs, custom properties, commentaires et ordre.
Récupération, dialecte, extensions fournisseur, commentaires, espaces et erreurs exactes doivent être vérifiés sur un moteur réel.
Read the formatted result
Le résultat est un CSS lisible. Comparez sélecteurs, déclarations, valeurs, commentaires, blocs, fonctions et ordre avec la source.
Un échec ne prouve pas le support exact du parseur ou sa récupération.
Un problème navigateur, linter ou build est séparé; formater n’optimise pas les performances.
Erreurs courantes
Prendre l’indentation pour une validation peut cacher valeurs invalides, spécificité surprenante ou problèmes d’accessibilité.
Modifier custom properties, chaînes, URLs, escapes ou ordre peut changer le comportement.
Ne supposez pas qu’une extension fournisseur fonctionne partout.
Coller URLs privées, tokens ou styles utilisateurs peut exposer des données.
Limites et cas particuliers
La fonction formate la présentation CSS et ne garantit ni standards, lint, accessibilité, sécurité, performance, compatibilité ni minification.
Testez custom properties, at-rules, extensions, fonctions, escapes, commentaires et grandes feuilles avec les outils cibles.
Ne collez pas de styles confidentiels sans autorisation.
Examples
Le formatage valide-t-il le CSS ?
Le formatage valide-t-il le CSS ?
Collez une feuille CSS complète ou un fragment compatible.
Le résultat est un CSS lisible. Comparez sélecteurs, déclarations, valeurs, commentaires, blocs, fonctions et ordre avec la source.
Change-t-il le cascade ?
Change-t-il le cascade ?
Examinez sélecteurs, accolades, déclarations, commentaires, propriétés personnalisées, fonctions et at-rules.
Un échec ne prouve pas le support exact du parseur ou sa récupération.
Les valeurs sont-elles conservées ?
Les valeurs sont-elles conservées ?
Comparez propriétés, valeurs, guillemets, URLs, variables et ordre avec la source.
Un problème navigateur, linter ou build est séparé; formater n’optimise pas les performances.
Les commentaires sont-ils conservés ?
Les commentaires sont-ils conservés ?
Lancez linter, build, accessibilité et tests navigateur.
Le résultat est un CSS lisible. Comparez sélecteurs, déclarations, valeurs, commentaires, blocs, fonctions et ordre avec la source.
Peut-il formater une media query ?
Peut-il formater une media query ?
Retirez URLs privées, tokens et données utilisateur des exemples.
Un échec ne prouve pas le support exact du parseur ou sa récupération.
Améliore-t-il les performances ?
Améliore-t-il les performances ?
Collez une feuille CSS complète ou un fragment compatible.
Un problème navigateur, linter ou build est séparé; formater n’optimise pas les performances.
Frequently asked questions
Le formatage valide-t-il le CSS ?
Non. Utilisez parseur, linter, build, accessibilité et navigateur.
Change-t-il le cascade ?
Seuls les espaces devraient changer; comparez l’ordre et testez.
Les valeurs sont-elles conservées ?
Les exemples gardent valeurs, chaînes, URLs et fonctions; vérifiez le diff.
Les commentaires sont-ils conservés ?
Les exemples gardent les commentaires; confirmez sur votre entrée.
Peut-il formater une media query ?
L’exemple montre une at-rule imbriquée; confirmez le support.
Améliore-t-il les performances ?
Non. Utilisez profiling et optimisation ciblée.
Répare-t-il un CSS invalide ?
Ne le présumez pas; corrigez la source et validez.
Que faire après ?
Révisez le diff et lancez linter, build, accessibilité et tests navigateur.