Apa Itu Border, Padding, Dan Margin Pada Css?

 
Sebelum kita memulai mengatur letak halaman kita, perlu kiranya diperhatikan posisi padding maupun margin dari tiap halaman blog kita, semakin rapi letaknya, maka akan semakin menarik blog kita... Untuk lebih terperinci perihal apa itu border, padding maupun margin, kau sanggup melihat ilustrasi berikut..

Dari ilustrasi di atas, sanggup terlihat bagian-bagian yang ada pada masing-masing halaman blog kamu..

• Content dapat berupa bab isi dari halaman kamu;
• Padding merupakan jarak yang memisahkan bab isi dengan border atau bab isi tanpa border dengan margin-nya.
• Border merupakan garis pinggir yang sering dipakai untuk membingkai bab isi tersebut;
• Margin merupakan bab terluar atau yang memisahkan padding dengan halaman.

Ada beberapa satuan yang sering saya gunakan dipakai pada CSS ibarat :

• pt : point (1 pt = 1/72 inch)


• px : pixel (merupakan ukuran terkecil pada monitor)


• % : persen (dalam bentuk persentase)


• em : atau ems (merupakan ukuran font pada elemen)

Ada juga sih satuan lain ibarat in (inchi), cm, mm, pc, ex, tapi ukuran tersebut jarang saya gunakan lantaran semakin banyak satuan ukuran yang dipakai akan semakin pusing kita mengatur halaman kita... hehehe..

Dalam mengatur/meng-edit padding, border, dan margin-nya, kita sanggup memakai satuannya tersebut ibarat berikut ni contohnya....

padding: 5px 0px 5px 0px;

Pada pengaturan di atas, urutan angkanya dimulai dari atas, kanan, bawah dan kiri. Atau kalau pusing dalam menggunakannya, kau cukup memakai padding-(top/right/left/bottom)..

contohnya,,

padding-top: 5px (ini berarti jarak antara bab isi dengan marginnya sebesar 5 pixel)..

Aturan di atas sanggup juga kau gunakan pada border ataupun margin, namun khusus pada bab border, hukum ibarat itu jarang saya gunakan lantaran niscaya lucu kalo bingkainya besar kecil sebelah.. hwahwa ...

Untuk bab border, biasanya dipakai hukum ibarat ini contohnya...

border: 2px solid #362df4;

Artinya kayak gini nich : "hai border, saya pengen kau berukuran 2 pixel, bentuknya solid/ga putus-putus dan warnanya biru(#362df4)...

kesudahannya jadi ibarat ini...

Isi content kamu

Selain bentuk solid, kau juga sanggup memakai kata dotted, dashed, groove, ridge, inset, outset, dll... (jadi inget waktu bikin friendster nich...!!! )

Pengen tau bentuk lainnya ibarat apa?? praktekin eksklusif dunkz semoga ngerti n paham.... Selamat berkreasi ya....

Apa Itu Border, Padding, Dan Margin Pada Css? 2019-05-03T05:31:00-07:00 Rating: 4.5 Diposkan Oleh: abp29