위치 지정(Positioning)
position
속성은 웹 페이지 내 HTML 요소의 위치 배치 방식을 결정합니다.
Static 위치 지정
static
은 모든 요소의 기본 배치 방식입니다.
별도로 위치를 지정하지 않으면 요소는 원래 순서대로 자동으로 배치됩니다.
static 속성 사용 예시
.box {
position: static;
}
Relative 위치 지정
relative
는 요소의 원래 위치 기준 상대적으로 이동합니다.
예를 들어 아래 CSS box 클래스는 클래스가 적용된 요소를 20px
만큼 좌측으로, 10px
만큼 위로 이동시킵니다.
relative 속성 사용 예시
.box {
position: relative;
left: 20px;
top: 10px;
}