Sabtu, 17 Maret 2018

Css ( Cascanding Style Sheet ) Shorthand

Assalamuakaikum wr.wb

Selamat pagi sahabat blogger alhamadulilah masih di sambut sama pagi yang cerah ya, mudah-mudahan kita di beri fasilitas dalam melaksanakan apapun hari ini , Amin !!!

Kali ini Belajar di Perantauan akan membahas wacana singkatan dari css ( CSS SHORTHAND ), pada pembahasan sebelumnya kita, membahas wacana fungi dan kegunaan MARGIN dan PADDING, sanggup kita simpulkan bahwa setiap property sanggup mempunyai lebih dari sati jenis, contohnya margin mempunyai 4 jenis, margin-top, margin-right, margin left, margin-buttom.

margin-top : 20px;
margin-right : 30px;
margin-left : 40px;
margin-buttom : 50px;

Dari pada menuliskan seluruh property tersebut, kita sanggup memakai CSS-Shorthan yaitu menggabungkan seluruh VALUES (top,right,buttom,left) ke dalam satu property.

Sebagai contoh, kita akan mnggunakan CSS-Shorthand untuk property margin menjadi menyerupai berikut :

margin : 20px 30px 40px 50px;
Masing-masing dari nilai tersebut ialah :
margin : top right buttom left

Kita juga sanggup bermain-main dengan property margin ini, perhatikan dengan secama tumpuan berikut :

·         Ketika kita memperlihatkan nilai pada property margin, ini artinya kita memperlihatkan nilai tersebut pada seluruh sisi.

Margin : 20px;
Dengan penulisan menyerupai ini, maka dari margin-top,right,buttom,left ialah 20px;


·       Ketika kita memperlihatkan dua nilai pada property margin, berarti nilai selanjutnya mengikuti nilai sebelumnya. Contoh :

Margin : 20px 30px;
Pada tumpuan di atas berarti kita memperlihatkan nilai margin-top dan right bukan ?, nah nilai dari mergin-buttom akan di samakan dengan nilai margin-top dan margin left sama dengan margin-right.

·         Dan saat kita menuliskan ketiga nilai ini, maka niali yang tidak di isi akan mengikuti nilai yang di isi, sama halnya saat kita memberi 2 nilai.

Margin : 20px 30px 40px;
Pada tumpuan diatas, kita memperlihatkan nilai untuk top,right dan buttom. Sedangkan untuk left  akan disamankan dengan right. Penggunaan menyerupai ini juga berlaku pada padding, dan property-property sejenis lainya.

Na bagaimana teman-teman blogger, mudah-mudahan mengerti ya, supaya bermamfaat, silhkan di share. 


Sumber http://beritatecnologi.blogspot.com


EmoticonEmoticon