tutorial pengembangan web terbaru
 

Style padding Property

<Style Object

Contoh

Mengatur padding dari <div> elemen:

document.getElementById("myDiv").style.padding = "50px 10px 20px 30px";
Cobalah sendiri "

Definisi dan Penggunaan

Padding set properti atau mengembalikan padding elemen.

Properti ini dapat berlangsung dari satu sampai empat nilai:

Kedua properti margin dan properti padding ruang insert sekitar elemen. Namun, perbedaannya adalah bahwa marjin menyisipkan ruang di sekitar perbatasan, sementara bantalan menyisipkan ruang dalam perbatasan elemen.

  • Satu nilai, seperti: div {padding: 50px} - keempat sisi akan memiliki padding 50px
  • Dua nilai, seperti: div {padding: 50px 10px} - bagian atas dan padding bawah akan 50px, kiri dan padding kanan akan 10px
  • Tiga nilai, seperti: div {padding: 50px 10px 20px} - padding atas akan 50px, kiri dan padding kanan akan 10px, padding bawah akan 20px
  • Empat nilai, seperti: div {padding: 50px 10px 20px 30px} - padding atas akan 50px, padding kanan akan 10px, padding bawah akan 20px, padding kiri akan 30px

Dukungan Browser

Internet ExplorerFirefoxOperaGoogle ChromeSafari

Properti padding didukung di semua browser utama.

Sintaksis

Kembali properti padding:

object .style.padding

Mengatur properti padding:

object .style.padding=" Nilai properti
Nilai Deskripsi
% Mendefinisikan padding di% dari lebar elemen induk
length Mendefinisikan padding di unit panjang
initial Set properti ini ke nilai default. Baca tentang awal
inherit Mewarisi properti ini dari elemen induknya. Baca tentang mewarisi

Rincian teknis

Nilai default: 0
Kembali Nilai: Sebuah String, yang mewakili padding dari unsur
CSS Versi CSS1

Contoh lebih

Contoh

Ubah padding dari keempat sisi dari <div> elemen untuk "25px" :

document.getElementById("myDiv").style.padding = "25px";
Cobalah sendiri "

Contoh

Kembali padding dari <div> elemen:

alert(document.getElementById("myDiv").style.padding);
Cobalah sendiri "

Contoh

Perbedaan antara properti margin dan properti padding:

function changeMargin() {
    document.getElementById("myDiv").style.margin = "100px";
}

function changePadding() {
    document.getElementById("myDiv2").style.padding = "100px";
}
Cobalah sendiri "

Pages terkait

CSS tutorial: CSS Padding

Referensi CSS: padding property

<Style Object