Properti HTML DOM Style paddingBottom
gaya Objects Definisi dan Penggunaan
PaddingBottom marjin set properti atau mengembalikan elemen berikutnya dalam.
tatabahasa
Pengaturan properti paddingBottom:
Object.style.paddingBottom="%|length|inherit"
Kembali sifat paddingBottom:
Object.style.paddingBottom
| 值 | 描述 |
|---|---|
| % | 定义基于父元素宽度的百分比下内边距。 |
| length | 使用 px、cm 等单位定义下内边距的宽度。 |
| inherit | 下内边距从父元素继承。 |
Dukungan Browser
Semua browser utama mendukung properti paddingBottom.
Catatan: IE7 dan versi sebelumnya tidak mendukung "mewarisi" nilai.IE8 hanya menyediakan! DOCTYPE didukung "mewarisi". dukungan IE9 "mewarisi".
Tips dan Catatan
properti margin dan padding dimasukkan ke dalam ruang di sekitar elemen. Namun, perbedaan tersebut, marjin akan dimasukkan ke dalam ruang di sekitar luar perbatasan, ruang sisipan bantalan dalam perbatasan elemen.
contoh
contoh
Mengubah padding bawah elemen div:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>本教程(w3big.com)</title>
<style type="text/css">
div{
border: 1px solid #FF0000;
}
</style>
<script>
function changeMargin(){
document.getElementById("ex1").style.marginBottom="100px";
}
function changePadding(){
document.getElementById("ex2").style.paddingBottom="100px";
}
</script>
</head>
<body>
<div id="ex1">这是一些文本。</div>
<br>
<button type="button" onclick="changeMargin()">修改div元素的底部外间距</button>
<br>
<br>
<div id="ex2">这是一些文本。</div>
<br>
<button type="button" onclick="changePadding()">修改div元素的底部内间距</button>
</body>
</html>
<html>
<head>
<meta charset="utf-8">
<title>本教程(w3big.com)</title>
<style type="text/css">
div{
border: 1px solid #FF0000;
}
</style>
<script>
function changeMargin(){
document.getElementById("ex1").style.marginBottom="100px";
}
function changePadding(){
document.getElementById("ex2").style.paddingBottom="100px";
}
</script>
</head>
<body>
<div id="ex1">这是一些文本。</div>
<br>
<button type="button" onclick="changeMargin()">修改div元素的底部外间距</button>
<br>
<br>
<div id="ex2">这是一些文本。</div>
<br>
<button type="button" onclick="changePadding()">修改div元素的底部内间距</button>
</body>
</html>
Coba »
gaya Objects