Style top 속성

정의 및 사용법

top 속성을 설정하거나 반환하여 정위치 요소의 상단 위치를 정의합니다。

이 속성은 요소의 상단 위치를 정의합니다. 내취약, 스크롤바, 경계선 및 여백을 포함합니다.

추천:정위치 요소는 position 속성 로 설정합니다:relativeabsolute 또는 fixed

추천:위치를 정하거나 반환하려면 사용하십시오 bottom 속성

추가로 참조하십시오:

CSS 강의:CSS 정위치

CSS 참조 가이드:top 속성

예제

예제 1

<button> 요소의 상단 위치 설정:

document.getElementById("myBtn").style.top = "100px";

직접 시도해 보세요

예제 2

음수 값을 사용하여 <div> 요소의 상단 위치 설정:

document.getElementById("myDiv").style.top = "-100px";

직접 시도해 보세요

예제 3

<div> 요소의 상단 위치 반환:

alert(document.getElementById("myDiv").style.top);

직접 시도해 보세요

문법

top 속성 반환:

object.style.top

top 속성 설정:

object.style.top = "auto|length|%|initial|inherit"

속성 값

설명
auto 브라우저가 상단 위치를 설정합니다. 기본값.
length 길이 단위로 상단 위치를 정의합니다. 음수 값을 허용합니다。
% 부모 요소 높이의 퍼센트로 상단 위치를 설정합니다。
initial 이 속성을 기본 값으로 설정합니다. 참조하십시오 initial
inherit 부모 요소에서 이 속성을 상속받습니다. 참조하십시오 inherit

기술 세부 사항

기본 값: 없음
반환 값: 문자열로, 위치를 정하는 요소의 상단 위치를 나타냅니다。
CSS 버전: CSS2

브라우저가 지원

크롬 에지 파이어폭스 사파리 오페라
크롬 에지 파이어폭스 사파리 오페라
지원 지원 지원 지원 지원