CSS Tutorials CSS Abkürzungen

:: CSS Tutorials CSS Abkürzungen - CSS abkürzen

Startseite Tutorials Css Tutorials CSS Tutorials CSS Abkürzungen - CSS abkürzen

In CSS Ist es möglich umfangreiche Definitionen, die das gleiche Element beschreiben, zusammenzufassen (abkürzen).

Angenommen wir haben eine Rahmenformatierung die folgenderweise definiert ist:
border-width:1px; border-style:solid; border-color:#000000;

das Ganze können wir abkürzen und erreichen genau den gleichen Effekt:
border:1px solid #000000;

Das gleiche gilt z.b. auch für die Schrift. Angenommen wir haben eine Schrift so formatiert:
font-family:Arial, Helvetica, sans-serif; font-size:12px; font-weight:bold; color:#000000;

Die selbe Formatierung erreichen wir auch mit wesentlich weniger CSS Angaben:
font: Arial, Helvetica, sans-serif 12px bold #000000;

Für das Padding Attribut gilt natürlich das Gleiche:
padding-top:10px; padding-right:0; padding-bottom:10px; padding-left:0px;

Die selbe Formatierung erreichen wir auch mit folgenden Angaben:
padding: 10px 0 10px 0;

und dieses CSS Statement können wir immer noch weiter abkürzen:
padding: 10px 0;

Die body, table, div und weitere Formatierungen von Hintergründen kann man auch als eine Abkürzung schreiben. Statt:
background-color: #FFFFFF; background-image: url(bildname.jpg); background-position: left top; background-repeat: no-repeat; background-attachment: fixed;

setzen wir die kurze Form ein:
background: #FFFFFF url(bildname.jpg) left top no-repeat fixed;

CSS Abkürzungen für die Farbangaben:
color: #FFCC99; wird zu color: #FC9;

Das dürfte so einige CSS files um einige KB kleiner machen.
Viel Erfolg beim Einsetzen.