Sifat padding

Sifat padding menetapkan padding dalam elemen. Nilai untuk sifat ini adalah sebarang unit untuk saiz. Secara lalai, setiap pelayar boleh menambah padding yang berbeza kepada elemen. Sifat ini adalah singkatan untuk sifat padding-top, padding-right, padding-bottom, padding-left.

Sintaks

csspemilih {
  padding: nilai;
}

Sifat padding menerima 1, 2, 3 atau 4 nilai, disenaraikan dengan ruang:

Bilangan	Penerangan
`1`	Satu nilai menetapkan padding dari semua sisi elemen.
`2`	Nilai pertama menetapkan padding atas dan bawah, dan nilai kedua - kanan dan kiri.
`3`	Nilai pertama menetapkan padding atas, nilai kedua - kanan dan kiri, dan nilai ketiga - bawah.
`4`	Nilai pertama menetapkan padding atas, nilai kedua - kanan, nilai ketiga - bawah, dan nilai keempat - kiri.

Dalam kes ini, secara lalai padding dalam akan sifar dan teks akan rapat dengan sempadan blok:

html<div id="elem">
  some long text
</div>

css#elem {
  padding: 0;
  width: 300px;
  border: 1px solid black;
  text-align: justify;
}

Результат:

Dan sekarang mari kita buat padding dalam sebanyak 30px:

html<div id="elem">
  some long text
</div>

css#elem {
  padding: 30px;
  width: 300px;
  border: 1px solid black;
  text-align: justify;
}

Результат:

Sekarang padding atas dan bawah akan 20px, dan kanan dan kiri - 5px:

html<div id="elem">
  some long text
</div>

css#elem {
  padding: 20px 5px;
  width: 300px;
  border: 1px solid black;
  text-align: justify;
}

Результат:

Sekarang padding atas 5px, kanan - 15px, bawah - 25px, kiri - 35px:

html<div id="elem">
  some long text
</div>

css#elem {
  padding: 5px 15px 25px 35px;
  width: 300px;
  border: 1px solid black;
  text-align: justify;
}

Результат: