Mit dem kostenlosen Onlinetool kann man schlecht formatierten Css Code in eine schönere Form bringen. Natürlich ist der Sinn der Sache nicht ein optisch schöner Css Code, sondern ein Code, der einfacher zu bearbeiten ist.

Die Vorgehensweise ist dabei ganz einfach. Man kopiere den Code von der Seite mit dem lieblos gestalteten Css-Code und kopiere ihn in das linke Fenster. Nach einem Klick auf Beautify erscheint der Code auf der rechten Seite schön sauber formatiert, so wie es sein soll. Alternativ kann man auch eine Url einer Css Datei eingeben.. mit dem gleichen Ergebnis.

image.png

Minify
Besonders praktisch finde ich die Funktion “Minify”. Klickt man auf diesen Button, werden alle überflüssigen Absätze und Leerzeichen aus dem Dokument entfernt. Dies sollte allerdings erst dann geschehen, wenn man mit der Css Formatierung fertig ist. Überschreibt man dann seinen schön formatierten Css Code mit dem minimalisierten Code, sollte das Resultat eine leichte Performancesteigerung sein, da der Browser beim Lesen des Css-Codes die Leezeichen nicht im Weg hat.

image.png

Der neu formatierte Code lässt sich dann entweder per Copy & Paste kopieren und in die jeweilige Css Datei einfügen, oder per Download-Button runterladen.

Besonderheiten

  • Praktischer Minifyer
  • Online-Tool
  • kostenlos

Fazit
Ein sehr wertvolles Werkzeug für alles CSSler. Gerade den Minifyer finde ich super. Die Bedienung ist einfach, so muss das sein. Hier gehts zum CSS Code Beautifyer.

Weitere Programmiersprachen
Das Ganze gibt es auf der Seite codebeautify übrigens auch noch für viele weitere Programmiersprachen, darunter auch Html.

image.png