Pengertian Padding, Margin Dan Border Dalam Blog

Kali Ini Adalah Pengertian Dari Masing-Masing Komponen :

• Padding : Digunakan Untuk Menentukan Jarak Komponen Body Ke Bagian Border Atau Ukuran Jarak Bagian Dalam.
• Border : Garis Tepi Dari Sebuah Komponen (Content)
• Margin : Ukuran Jarak Bagian Luar Atau Jarak Setelah Border.

Bagaimana? Sederhana Bukan? Hehehe. Silahkan Diperdalam Dahulu Pengertian Ke-3 Komponen Di Atas Kemudian Lanjut Ke Cara Penggunaannya.

Cara Penggunaan :

Padding 

Penulisan CSS Untuk Padding Adalah padding:5px 5px 5px 5px; Urutan Penggunaan Ukurannya Adalah Mulai Dari Yang Paling Depan Yaitu Atas, Kanan Bawah, Kiri. Atau Jika Sobat Ingin Memecahnya Menjadi Bagian Yang Lebih Spesifik Yaitu : 

• padding-top:5px; ~ Digunakan Untuk Padding Bagian Atas
• padding-right:5px; ~ Digunakan Untuk Padding Bagian Kanan
• padding-bottom:5px; ~ Digunakan Untuk Padding Bagian Bawah
• padding-left:5px; ~ Digunakan Untuk Padding Bagian Kiri

Margin

Penulisan CSS Untuk Margin Adalah margin:5px 5px 5px 5px; Urutan Penggunaan Ukurannya Adalah Mulai Dari Yang Paling Depan Yaitu Atas, Kanan Bawah, Kiri. Atau Jika Sobat Ingin Memecahnya Menjadi Bagian Yang Lebih Spesifik Yaitu : 

• margin-top:5px; ~ Digunakan Untuk Margin Bagian Atas
• margin-right:5px; ~ Digunakan Untuk Margin Bagian Kanan
• margin-bottom:5px; ~ Digunakan Untuk Margin Bagian Bawah
• marg-left:5px; ~ Digunakan Untuk Margin Bagian Kiri

Border

Penulisan CSS Untuk Border Adalah border:3px solid #666666 . Dari 3 Komponen Border Tersebut Berikut Penjelasannya :

• border:3px ~ Merupakan Ukuran Ketebalan Dari Border Tersebut (border-width)
• solid ~ Merupakan Jenis Style Dari Border Tersebut (border-style)
• #666666 ~ Merupakan Warna Dari Border Tersebut (border-color)

Macam-Macam Satuan Dalam CSS

Satuan Dalam CSS Dikelompokkan Menjadi 2 Bagian Yaitu:

1. Statik
2. Relatif

Penjelasannya Setiap Kelompoknya :

Relatif

• in ~ Satuan Inchi
• cm ~ Satuan Centimeter
• mm ~ Satuan Milimeter
• pt ~ Satuan Point (1 Point = 1/72 Inchi)
• pc ~ Satu Pica (1 Pica = 12 Point)
• px ~ Satuan Pixel (Titik Terkecil Dalam Visual PC)

Statik

• % ~ Satuan Persen
• em ~ Satuan em / ems (1em = Ukuran Font Yang Tengah Dalam Elemen)
• ex ~ Satuan X-Height Suatu Font (X-Height Biasanya Setengah Dari Ukuran Dasar Font)

Contoh Dari Style Border

dashed

solid

dotted

double

groove

ridge

inset

outset