Properti HTML DOM Style marginBottom
gaya Objects Definisi dan Penggunaan
marginBottom set properti atau mengembalikan elemen berikutnya dari luar.
tatabahasa
Pengaturan properti marginBottom:
Object.style.marginBottom="%|length|auto|inherit"
Kembali sifat marginBottom:
Object.style.marginBottom
| 值 | 描述 |
|---|---|
| % | 定义基于父元素宽度的百分比下外边距。 |
| length | 使用 px、cm 等单位定义下外边距的宽度。 |
| auto | 浏览器设定的下外边距。 |
| inherit | 下外边距从父元素继承。 |
Dukungan Browser
Semua browser utama mendukung properti marginBottom.
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 margin bawah dari 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