CSS Garden

Tipps und Tricks über Stylesheets

 

    Web Server's Default Page
    Web Server's Default Page

    This page is generated by Plesk, the leading hosting automation software. You see this page because there is no Web site at this address.

    You can do the following:

    • Create domains and set up Web hosting using Plesk.
    What is Plesk

    Plesk is a hosting control panel with simple and secure web server and website management tools. It was specially designed to help IT specialists manage web, DNS, mail and other services through a comprehensive and user-friendly GUI. Learn more about Plesk.

 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

 

© 1997 - 2019