CSS bazı şeyler yaparken kısaltmaları kullanırız. Kullanıdığımız kısaltmalar sayesinde fazla koddan kurtulmuş oluruz.

Normalde 1 font tanımlarken tam 4 adet CSS kodu kullanılır. Bu kodlar:

1. Font
font-weight: bold;
font-family: verdana, sans-serif;
font-size: 11px;
line-height: 15px;
Bu kodların kısaltması ise:
font: bold 11px/15px verdana, sans-serif;
2.Arkaplan [Backgrounds]

Arkaplan tanımlarken tam 5 adet tanım yapmamız gerekir. Bunu yaparken kısaltma kullanarak tek tanıma indirebiliriz.

background-color: #000;
background-image: url(ard.jpg);
background-repeat: no-repeat;
background-attachment: fixed;
background-position: 50px 50px;
Bu kodu kısaltırsak:
background: { #000 url(ard.jpg) no-repeat fixed 50px 50px; }
3.Renkler [Hex-Decimal]

CSS kodlamalarında renkler genellikle Hex-Decimal renk kodu olarak adlandırılır. Örneğin:

color: #ff0000;Kırmızı
Renkler 6 karakterle gösterilsede bir çok renk(web tabanlı) 3 karakterin tekrarlanması ile oluşturulur. Örneğin, kırmızının hex-decimal kodunun kısaltırsak:

color:#f00;Kırmızı
4. Border

Kenarlık tanımlamalarında her özellik için bir tanımlama yapılır. Örnek olarak bir elementin üst kenarına atama yapmak için:

border-top-width: 2px; border-top-style: dashed; border-top-color: #f00;
Kısa hali:
border-top: 2px dashed #f00;
Bu özellikleri her kenara uygulamak içindir:
border: 2px dashed #f00;

5. Margin ve Padding'ler
Margin ve paddingler de normal tanımlama şöyledirler:

margin-top: 10px; margin-right: 5px; margin-bottom: 20px; margin-left: 15px;
Kısa hali:
margin: 10px 5px 20px 15px;