CSS-formatter

Een CSS-formatter leest een stylesheet en herschrijft deze met consistente spatiëring, inspringing en regeleindes, zodat deze gemakkelijk te lezen en te onderhouden is. Het parseert de CSS in de onderliggende structuur van regels, selectors, declaraties, at-regels en opmerkingen en drukt die structuur vervolgens weer af met behulp van een voorspelbare lay-out: één declaratie per regel, een enkele spatie na elke dubbele punt, en elk genest blok ingesprongen één niveau dieper dan de bovenliggende regels. De stijlregels blijven identiek, maar een bestand dat als één lange, ononderbroken regel is aangekomen, wordt iets dat je daadwerkelijk kunt scannen en bewerken.

Dezelfde tool werkt omgekeerd als een CSS-minifier Het minimaliseren van strips elke ruimte, tabblad, regeleinde, en (optioneel) commentaar dat een browser niet nodig heeft, het instorten van de stylesheet tot het kleinste byte-voor-byte equivalent Een goed opgemaakte 6 KB stylesheet daalt vaak onder de 4 KB zodra de witruimte weg is, wat betekent minder bytes over het netwerk en een snellere eerste verf Verfraai terwijl u aan het schrijven en debuggen bent; minifieer de kopie die u naar productie verzendt.

Deze opmaakmaker begrijpt de onderdelen van CSS die naïeve find-and-replace scripts uitschakelen Geneste at-regels zoals @media en @supports houden hun innerlijke regels correct ingesprongen, @keyframes blokken met percentage stappen worden bewaard, string literals in content en url () waarden worden precies zoals geschreven gelaten, en opmerkingen worden op verzoek bewaard of verwijderd Alles draait volledig in uw browser, dus uw stylesheet, inclusief eventuele eigen design tokens of interne klassenamen, wordt nooit geüpload, en de tool blijft werken nadat de pagina is geladen, zelfs zonder verbinding.