HTML DOM 스타일 Top 속성
스타일 개체 정의 및 사용
상위 속성 집합 또는 위치 요소의 상단 위치를 반환합니다.
패딩, 스크롤 막대, 테두리 및 여백 :이 속성은 상위 요소의 위치 포함을 지정합니다.
팁 : 위치 결정 요소는 요소의 위치 속성이 설정되어있다 : 상대 (상대) 절대치 (절대) 또는 고정 (고정).
문법
상위 속성을 설정합니다 :
Object.style.top="auto|length|%|inherit"
상단 속성을 뒤로 :
Object.style.top
| 值 | 描述 |
|---|---|
| auto | 默认。通过浏览器计算顶部的位置。 |
| length | 使用 px、cm 等单位定义元素的顶边到最近一个具有定位设置父元素的顶部边缘的位置。可使用负值。 |
| % | 定义元素的顶边到最近一个具有定位设置父元素的顶部边缘的百分比位置。 |
| inherit | top 属性的值从父元素继承。 |
브라우저 지원
모든 주요 브라우저 상단 속성을 지원합니다.
참고 : IE7 및 이전 버전은 "상속"값을 지원하지 않습니다.IE8은 "상속"지원!의 DOCTYPE을 제공합니다. IE9 지원 "상속".
예
예
상단 위치에 버튼을 설정 :
<! DOCTYPE html로>
<HTML>
<헤드>
<메타 문자 집합 = "UTF-8">
<제목>이 튜토리얼 (w3big.com) </ 제목>
<스타일 유형 = "텍스트 / CSS">
#의 B1 {
위치 : 절대;
}
</ 스타일>
<스크립트>
displayResult 함수 () {
. 중요 document.getElementById ( "B1") style.top = "100 픽셀";
}
</ 스크립트>
</ 헤드>
<바디>
<입력 유형 = "버튼"식의 onclick = "displayResult ()"값 "B1"= "최상위 순위 100 픽셀로 설정">
</ BODY>
</ HTML>
<HTML>
<헤드>
<메타 문자 집합 = "UTF-8">
<제목>이 튜토리얼 (w3big.com) </ 제목>
<스타일 유형 = "텍스트 / CSS">
#의 B1 {
위치 : 절대;
}
</ 스타일>
<스크립트>
displayResult 함수 () {
. 중요 document.getElementById ( "B1") style.top = "100 픽셀";
}
</ 스크립트>
</ 헤드>
<바디>
<입력 유형 = "버튼"식의 onclick = "displayResult ()"값 "B1"= "최상위 순위 100 픽셀로 설정">
</ BODY>
</ HTML>
»시도
스타일 개체