HTML DOM 스타일 paddingTop 속성
스타일 개체 정의 및 사용
paddingTop 속성 세트에 여백 또는 내의 요소를 반환합니다.
공간 패딩 속성은 요소 테두리 사이의 내용 요소를 정의합니다.
문법
paddingTop 속성 설정 :
Object.style.paddingTop="%|length|inherit"
위로 paddingTop 속성 :
Object.style.paddingTop
| 值 | 描述 |
|---|---|
| % | 定义基于父元素宽度的百分比上内边距。 |
| length | 使用 px、cm 等单位定义上内边距的宽度。 |
| inherit | 上内边距从父元素继承。 |
브라우저 지원
모든 주요 브라우저는 paddingTop 속성을 지원합니다.
참고 : IE7 및 이전 버전은 "상속"값을 지원하지 않습니다.IE8은 "상속"지원!의 DOCTYPE을 제공합니다. IE9 지원 "상속".
팁과주의 사항
마진 속성과 패딩 속성은 요소 주위의 공간에 삽입됩니다. 그러나, 차이는 마진 소자 경계 내의 경계 외부 패딩 삽입 공간의 주위의 공간에 삽입 될 것이다.
예
예
내부 가장자리에 DIV 요소를 변경 :
<! DOCTYPE html로>
<HTML>
<헤드>
<메타 문자 집합 = "UTF-8">
<제목>이 튜토리얼 (w3big.com) </ 제목>
<스타일 유형 = "텍스트 / CSS">
사업부 {
국경 : 1 픽셀 고체 #의 FF0000;
}
</ 스타일>
<스크립트>
changeMargin 함수 () {
중요 document.getElementById ( "EX1") style.marginTop는 = "100 픽셀";
}
changePadding 함수 () {
중요 document.getElementById ( "EX2") style.paddingTop는 = "100 픽셀";
}
</ 스크립트>
</ 헤드>
<바디>
<사업부 아이디 = "EX1은">이 텍스트입니다. </ DIV>
로 <br>
<버튼 유형 = "버튼"onclick을 = "changeMargin ()"> 외부 공간의 상단에 DIV 요소를 수정 </ 버튼>
로 <br>
로 <br>
<사업부 아이디 = "EX2는">이 텍스트입니다. </ DIV>
로 <br>
<버튼 유형 = "버튼"onclick을 = "changePadding ()"> 간격 div 요소의 상단에서 수정 </ 버튼>
</ BODY>
</ HTML>
<HTML>
<헤드>
<메타 문자 집합 = "UTF-8">
<제목>이 튜토리얼 (w3big.com) </ 제목>
<스타일 유형 = "텍스트 / CSS">
사업부 {
국경 : 1 픽셀 고체 #의 FF0000;
}
</ 스타일>
<스크립트>
changeMargin 함수 () {
중요 document.getElementById ( "EX1") style.marginTop는 = "100 픽셀";
}
changePadding 함수 () {
중요 document.getElementById ( "EX2") style.paddingTop는 = "100 픽셀";
}
</ 스크립트>
</ 헤드>
<바디>
<사업부 아이디 = "EX1은">이 텍스트입니다. </ DIV>
로 <br>
<버튼 유형 = "버튼"onclick을 = "changeMargin ()"> 외부 공간의 상단에 DIV 요소를 수정 </ 버튼>
로 <br>
로 <br>
<사업부 아이디 = "EX2는">이 텍스트입니다. </ DIV>
로 <br>
<버튼 유형 = "버튼"onclick을 = "changePadding ()"> 간격 div 요소의 상단에서 수정 </ 버튼>
</ BODY>
</ HTML>
»시도
스타일 개체