CSS Garden

 

• Startseite
• Kontakt
• Impressum

• Auto Theorieprüfung
• Pokerroom
• Valid XHTML 1.0

 Effizienter CSS-Code

1. Redundante Einheiten für Null-Werte

   Bei Null-Werten wird die Einheit - in diesem Fall Pixel - nicht gebraucht:

   padding:0px 0px 5px 0px;

   Die effizientere Schreibart lautet:

   padding:0 0 5px 0;

   Dasselbe gilt für andere "Styles" z. Bsp.:

   margin:0;

   Verschwende keine Bytes für Einheiten wie px, pt, em, etc, wenn der Wert 0 ist. Das einzige Argument um es doch zu tun kann sein, dass später einfach Werte eingefügt werden können. Null Pixels ist das gleich wie null Punkte.

   Line-height kann auch ohne Unit verwendet werden. Das folgende Statement ist also gültig:

   line-height:1;

2. Vermeiden von doppelten Farbcodes

   Folgende Werte sollten umgeschrieben werden:

   color:#ffffff;
background-color:#000000;
border:1px solid #ee66aa;

   Effizienter sieht der Code folgendermassen aus:

   color:#fff;
background-color:#000;
border:1px solid #e6a;

   Bei folgendem Wert kann natürlich nichts abgekürzt werden:

   color:#fe69b2;

3. Vermeiden von Wiederholungen

   Das folgende Beispiel kann in einer einzigen Linie geschrieben werden:

   border-top:1px solid #00f;
border-right:1px solid #00f;
border-bottom:1px solid #00f;
border-left:1px solid #00f;

   So sieht der Code zusammengefasst aus:

   border:1px solid #00f;

Übersetzter Auszug aus einem englischen Artikel von Chess Hester: http://www.designdetector.com/link/to/ten-common-css-mistakes/

 

Zurück