4.1 CSS-Shorthand
Sama dengan sifat property yang memiliki beberapa turunan seperti :
Padding à padding-top,
padding-ringht,
padding-bottom,
padding-left.
Daripada kita menuliskan satu per satu, CSS telah mneyediakan fitur yang disebut CSS-Shorthand, yaitu menggabungkan beberapa value dari beberapa property turunan yang diturunkan dari property yang sama.
Sebagai contoh terdapat property sebagai berikut :
div {
padding-top: 15px;
padding-right: 20px;
padding-bottom: 15px;
padding-left: 20px;
}
Penulisan CSS diatas dapat disederhanakan dengan property padding, dengan urutan value searah jarum jam dimulai dari padding-top, sebagai berikut :
div {
Padding : 15px 20px 15px 20px
}
Skrip diatas masih bisa disingkat lagi menggabungkan top dan bottom dan menggabungkan right dengan left. Sehingga sebagai berikut :
div {
Padding :15px 20px;
}
Note : Jika ke empatnya memiliki nilai yang sama, bisa kita tulis dalam satu value saja. Misalnya pada contoh di atas angka 15 diganti menjadi 20 semua, maka penulisannya akan semakin singkat sebagai berikut :
div {
Padding : 20px;
}
Artinya, seluruh padding baik top, right, bottom dan left memilki nilai 20 px.
Penyederhanaan penulisan property inilah yang disebut CSS-Shorthand
Semoga bermanfaat buat sobat yang baru tau👊👊👋😉
0 Comments