Es ist möglich, mehrere CSS-Eigenschaften zu bündeln und in einer Zeile zusammenzufassen, z.B. statt
Selektor {
margin-top: 10px;
margin-right: 10px;
margin-bottom: 10px;
margin-left: 10px;
}
ist folgende Verkürzung möglich:
Selektor {
margin: 10px;
}
In folgendem Beispiel sind die Außenabstände jeweils für oben und unten sowie für links und rechts gleich:
Selektor {
margin-top: 20px;
margin-right: 10px;
margin-bottom: 20px;
margin-left: 10px;
}
Verkürzt geschrieben:
Selektor {
margin: 20px 10px; /* Der erste Wert zählt für oben und unten, der zweite für links und rechts */
}
Hier die Verkürzung am Beispiel border mit den Eigenschaften border-width (Rahmendicke), border-style (durchgezogen, gepunktet) und Farbe.
Die Langversion:
Selektor {
border-top-width:1px;
border-right-width:1px;
border-bottom-width:1px;
border-left-width:1px;
border-style: dotted;
border-color: #f00;
}
Die Verkürzung (alle Anweisungen in einer Zeile):
Selektor {
border:1px dotted #f00;