Pourquoi formater du code CSS
Le code CSS issu d'un outil de compression ou copié depuis une source externe se présente souvent sur une seule longue ligne sans aucun espace, ce qui complique le suivi des règles et des propriétés à l'intérieur de chaque sélecteur. Le formatage place chaque propriété sur une ligne distincte et organise les accolades, ce qui vous permet de lire et de modifier le code facilement sans vous perdre dans un texte compact.
La structure CSS qui rend le formatage plus clair
La structure CSS est simple : chaque règle se compose d'un sélecteur suivi d'une accolade ouvrante {, puis d'un ensemble de propriétés, chacune sous la forme propriété: valeur;, et enfin d'une accolade fermante } à la fin. Ce qui complique le plus souvent la lecture, c'est d'écrire toutes les propriétés sur une seule ligne ou d'oublier le point-virgule après une valeur. L'outil place chaque règle sur une ligne séparée et applique une indentation uniforme pour chaque propriété entre les accolades, ce qui vous permet de remarquer immédiatement s'il manque une accolade ou un point-virgule avant que le code n'atteigne le navigateur.
Comment formater le code
L'outil organise le code instantanément :
Ouvrez le Formateur CSS
Ouvrez l'outil depuis la page des outils.
Collez le code CSS
Collez le code que vous voulez formater dans la zone de saisie.
Laissez l'outil le formater
L'outil organise les propriétés et les accolades avec une indentation claire, automatiquement.
Copiez le résultat
Copiez le code formaté prêt à l'emploi ou téléchargez-le sous forme de fichier.