mengganti dan merubah template

Arti Padding Border Dan Margin Pada Blog

Dalam mengganti, merubah dan mengatur template sebuah blog tidak terlepas dari istilah content, padding, border dan margin.

Bagi blogger baru (seperti saya), pada awalnya istilah padding, margin dan border tersebut sungguh sangat membingungkan sebab setiap kali browsing ke blog lain yang ada hanya gambat skema saja. Tidak ada gambar untuk contoh yang riil.

Berikut saya ulas lagi pengertian Padding, Border dan margin lengkap dengan contoh riil pada bagian Title Wrapper / area judul blog yang telah saya praktekkan.

Content: Arti sebenarnya adalah isi. Karena dalam contoh praktek ini adalah area Title Wrapper, maka yang di maksud dengan content adalah " Judul Blog ". Letaknya dipusat paling dalam.
Padding: Adalah jarak antara content dengan border (Garis Batas). Biasanya dalam satuan pixel (px).
Border: Adalah Garis batas dengan ketebalan tertentu dalam satuan px misalnya 2px, yang letaknya di akhir ukuran / nilai padding.
Margin: Adalah jarak antara Border dengan garis terluar dari halaman atau yang bisa disebut dengan content outer/inner/wrapper atau bisa juga berupa perbatasan dengan content lainnya, misalnya dengan Description Wrapper atau deskripsi blog.

Secara skematik content, padding, border dan margin dapat di lihat pada gambar di bawah.
Klik Gambar Untuk Memperbesar Tampilan

Contoh Padding, Border dan Margin pada Title Wrapper / Area Judul blog dapat dilihat pada ilustrasi gambar sebagai berikut.
 Klik Gambar Untuk Memperbesar Tampilan
Padding, Border Dan Margin Sebelum Berubah

Title Wrapper dengan:
Padding atas dan bawah sebesar 22px, Padding Kiri dan kanan sebesar 30px.
Tanpa border dan tanpa margin.
 Klik Gambar Untuk Memperbesar Tampilan
Padding, Border Dan Margin Setelah Berubah

Title Wrapper dengan:
Padding atas dan bawah sebesar 22px, Padding Kiri dan kanan sebesar 30px,
Border: 2px (warna biru)
Margin: Atas 20px, Bawah 10px, Kiri 20px dan Kanan 20px.

Semoga bermanfaat dan salam blogger

Related Posts :



1 komentar:

  1. terimakasih, lengkap sekali ulasannya
    sangat bermanfaat untuk pemula sepeti saya ini

    BalasHapus