Im letzten Artikel CSS – Ordnung 1 habe ich etwas über das Inhaltsverzeichnis einer CSS-Datei geschrieben und einen Vorschlag gemacht, wie die Abteilung Allgemeine Selektoren ausschauen könnte.
Hier möchte ich einen Vorschlag zur Reihenfolge der Deklarationen in einem Deklarationsblock machen.
Diese sollten meiner Meinung nach immer gleich sein. Wenn z.B. die Deklaration für width immer an der gleichen Stelle in einem Deklarationsblock steht, erhöht das die Lesbarkeit der CSS-Datei enorm.
Dabei orientiere ich mich ein bißchen nach dem Boxmodell:
#startseite #inhalt p,#startseite #inhalt li {clear:....;float:...;position:....;z-index:....;width:...;height:......;background:.......;color:........;font:.........;text-indent:........;padding:.......;border:........;margin:........;}
Jedes Element das ich z.B. per Nachfahrenselektor ansprechen will steht in einer eigenen Zeile.
Nacheinander werden die Deklarationen in immer gleicher Reihenfolge eingetragen:
- Das Clearing
- Float
- Positionierungsarten
- Breite
- Höhe
- Hintergrund
- Textfarbe
- Textgröße
- Sonstige Texteigenschaften
- Der Innenabstand
- Rahmen
- Der Außenabstand
Das mache ich mittlerweile schon automatisch in dieser Reihenfolge.
Pingback: CSS – Ordnung 1 | KS Webdesign der Blog