HTML DOM 스타일 marginRight 속성
스타일 개체 정의 및 사용
속성 세트를 marginRight 또는 외부에서 오른쪽 요소를 반환합니다.
문법
marginRight 속성 설정 :
Object.style.marginRight="%|length|auto|inherit"
위로 marginRight 속성 :
Object.style.marginRight
| 值 | 描述 |
|---|---|
| % | 定义基于父元素宽度的百分比右外边距。 |
| length | 使用 px、cm 等单位定义右外边距的宽度。 |
| auto | 浏览器设定的右外边距。 |
| inherit | 右外边距从父元素继承。 |
브라우저 지원
모든 주요 브라우저는 marginRight 속성을 지원합니다.
참고 : IE7 및 이전 버전은 "상속"값을 지원하지 않습니다.IE8은 "상속"지원!의 DOCTYPE을 제공합니다. IE9 지원 "상속".
팁과주의 사항
마진 속성과 패딩 속성은 요소 주위의 공간에 삽입됩니다. 그러나, 차이는 마진 소자 경계 내의 경계 외부 패딩 삽입 공간의 주위의 공간에 삽입 될 것이다.
예
예
오른쪽 여백의 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.marginRight="100px";
}
function changePadding(){
document.getElementById("ex2").style.paddingRight="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.marginRight="100px";
}
function changePadding(){
document.getElementById("ex2").style.paddingRight="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>
»시도
스타일 개체