HTML-DOM Stil Margin Eigenschaft
Style - Objekte Definition und Verwendung
Margin Eigenschaft setzt oder gibt das nächste Element von außen.
Grammatik
Einstellen Margin Eigenschaften:
Object.style.marginBottom="%|length|auto|inherit"
Zurück Margin Eigenschaften:
Object.style.marginBottom
| 值 | 描述 |
|---|---|
| % | 定义基于父元素宽度的百分比下外边距。 |
| length | 使用 px、cm 等单位定义下外边距的宽度。 |
| auto | 浏览器设定的下外边距。 |
| inherit | 下外边距从父元素继承。 |
Browser-Unterstützung
Alle gängigen Browser unterstützen Margin Eigenschaft.
Hinweis: IE7 und früheren Versionen nicht unterstützen , die "erben" Wert.IE8 bietet nur! DOCTYPE unterstützt "erben". IE9 Unterstützung "erben".
Tipps und Hinweise
Randeigenschaften und Polstereigenschaften werden in den Raum um das Element eingefügt. Jedoch ist die Differenz, margin wird in den Raum um die Außenseite der Grenze, padding Einsätze Raum innerhalb des Elementbegrenzung eingesetzt werden.
Beispiele
Beispiele
Ändern Sie den unteren Rand des div-Elements:
<!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>
Versuchen »
Style - Objekte