Latest web development tutorials

HTML-DOM Stil margin Eigenschaft

Style-Objekt Referenz Style - Objekte

Definition und Verwendung

margin Eigenschaft legt Gibt das Element am linken Rand.

Grammatik

Einstellen margin Eigenschaften:

Object.style.marginLeft="%|length|auto|inherit"

Zurück margin Eigenschaften:

Object.style.marginLeft

描述
% 定义基于父元素宽度的百分比左外边距。
length 使用 px、cm 等单位定义左外边距的宽度。
auto 浏览器设定的左外边距。
inherit 左外边距从父元素继承。


Browser-Unterstützung

Internet ExplorerFirefoxOperaGoogle ChromeSafari

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 das div-Element am linken Rand:

<!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.marginLeft="100px";
}
function changePadding(){
    document.getElementById("ex2").style.paddingLeft="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-Objekt Referenz Style - Objekte