Menggunakan singkatan dapat membantu mengurangi ukuran file CSS Anda dan membuatnya lebih mudah dibaca. Aturan utama singkatan CSS adalah sebagai berikut:
warna
Nilai warna heksadesimal, apabila nilai masing-masing dua digitnya sama, dapat disingkat setengahnya, contoh: #000000 dapat disingkat #000;
Ukuran kotak
Biasanya ada empat metode penulisan:
property:value1; berarti semua sisi mempunyai nilai value1;
property:value1 value2; berarti nilai atas dan bawah adalah nilai1, dan nilai kanan dan kiri adalah nilai2
property:value1 value2 value3; artinya nilai atas adalah nilai1, nilai kanan dan kiri adalah nilai2, dan nilai bawah adalah nilai3
property:value1 value2 value3 value4; Keempat nilai mewakili atas, kanan, bawah, kiri secara berurutan
Cara mudah untuk mengingatnya adalah searah jarum jam, kanan atas, kiri bawah. Contoh penerapan spesifik pada margin dan padding adalah sebagai berikut:
margin:1em 0 2em 0,5em;
berbatasan
Sifat-sifat perbatasan adalah sebagai berikut:
lebar batas:1px;
gaya perbatasan: padat;
warna batas:#000;
Dapat disingkat menjadi satu kalimat: border:1px solid #000;
Sintaksnya adalah border:width style color;
Latar Belakang
Properti latar belakang adalah sebagai berikut:
warna latar belakang:#f00;
gambar latar belakang:url(background.gif);
latar belakang-ulangi:tidak berulang;
lampiran latar belakang: diperbaiki;
posisi latar belakang:0 0;
Dapat disingkat menjadi satu kalimat: background:#f00 url(background.gif) no-repeat fixed 0 0;
Sintaksnya adalah latar belakang: posisi lampiran ulang gambar berwarna;
Anda dapat menghilangkan satu atau beberapa nilai atribut. Jika dihilangkan, nilai atribut akan menggunakan nilai default browser.
warna: transparan
gambar: tidak ada
ulangi: ulangi
lampiran: gulir
posisi: 0% 0%
font
Properti font adalah sebagai berikut:
gaya font: miring;
varian font: huruf kecil;
berat font: tebal;
ukuran font:1em;
tinggi garis:140%;
font-family:"Lucida Grande",sans-serif;
Dapat disingkat menjadi satu kalimat: font:italic small-caps bold 1em/140% "Lucida Grande",sans-serif;
Perhatikan bahwa jika Anda menyingkat definisi font, Anda harus menentukan setidaknya dua nilai: ukuran font dan keluarga font.
Daftar
Untuk membatalkan titik dan nomor seri default, Anda dapat menulis list-style:none;,
Properti daftar adalah sebagai berikut:
tipe-gaya-daftar:persegi;
posisi-gaya-daftar:di dalam;
daftar-gaya-gambar:url(gambar.gif);
Dapat disingkat menjadi satu kalimat: list-style:square inside url(image.gif);