Embellisseur CSS
Re-indent and clean up minified or messy CSS — every selector on its own line, every declaration on its own line. — outil en ligne gratuit.
Réponse rapide: CSS Prettifier: Fonctionne dans le navigateur, gratuitement, sans inscription.
Dernière mise à jour
Questions fréquentes
- Les commentaires seront-ils conservés ?
- Oui — les commentaires de bloc <code>/* bloc */</code> comme les commentaires de style en ligne <code>//</code> sont conservés (bien que seuls les commentaires de bloc soient valides en CSS ; les commentaires en ligne sont transmis tels quels s'ils proviennent d'une particularité de l'entrée d'un préprocesseur).
- Comment les règles <code>@media</code> et les autres règles <code>@</code> sont-elles traitées ?
- Les règles <code>@</code> sont imbriquées correctement — les déclarations internes sont indentées d'un niveau supplémentaire par rapport au corps de la règle. Plusieurs règles <code>@</code> situées au même niveau conservent une ligne vide entre elles.
- Le formatage fonctionne-t-il avec SCSS ou Less ?
- Dans la plupart des cas — le découpeur en jetons ne comprend pas toute la grammaire des préprocesseurs (interpolation, mixins, <code>@if</code>), mais le SCSS simple est souvent correctement restitué. Pour un formatage précis des préprocesseurs, utilisez Prettier et son extension SCSS.
- Les sélecteurs sont-ils fusionnés ou séparés ?
- Les sélecteurs séparés par des virgules sont placés à raison d'un sélecteur par ligne afin que les différences restent lisibles. La sémantique demeure inchangée.
- Puis-je modifier la taille de l'indentation ?
- Oui — faites glisser le curseur de 0 à 8 espaces. La valeur par défaut est de 2.
- Les noms de propriétés inhabituels seront-ils conservés ?
- Oui — les préfixes de fournisseur (<code>-webkit-</code>, <code>-moz-</code>), les propriétés personnalisées CSS (<code>--my-var</code>) et les propriétés inconnues sont tous transmis sans modification.
- Le CSS est-il validé ?
- Non — le formatage est uniquement structurel. Soumettez le résultat au validateur CSS du W3C si vous avez besoin de vérifier sa conformité aux spécifications.
- Mes fichiers sont-ils envoyés ?
- Non — chaque transformation s'exécute dans votre navigateur. Même des jetons de conception confidentiels peuvent être collés ici en toute sécurité.
- Quelle taille de fichier puis-je embellir ?
- Les fichiers allant jusqu'à quelques mégaoctets sont embellis en bien moins d'une seconde. Au-delà, les performances dépendent surtout de la mémoire du navigateur.
- Pourquoi la sortie perd-elle parfois des points-virgules ?
- Nous ajoutons toujours un point-virgule final à la fin de chaque déclaration — si aucun n'apparaît, la valeur manquait également dans l'entrée. Comparez les deux versions côte à côte pour repérer l'élément réellement absent.