Position 속성 정리

Pulan·2022년 7월 19일
0

Position 이란?

-> element를 배치하는 방법을 지정해주는 속성이다.

position의 종류

static, relative, absolute, fixed, sticky

static

position을 아무것도 지정하지 않으면 사용되는 기본 값이다.

relative

position을 relative로 지정하면 해당 요소가 기본적으로 표시된 위치(static)를 기준으로 새로운 위치를 지정 할 수 있다.
주로 absolute의 시작 위치를 잡아주는 용도로 쓰인다.

absolute

가장 가까운 위치에 있는 조상/부모 요소를 기준으로 배치하고, 조상/부모 요소 중 position을 가진 요소가 없다면 body 요소를 기준으로 삼는다.(단. static을 제외한 값)
top , right , bottom , left 의 값으로 위치를 지정한다.

fixed

선택된 요소 특정 위치에 고정시킬 수 있다.
top , right , bottom , left 의 값으로 위치를 지정한다.

sticky

부모 요소 안에서의 현재 자신의 위치에 고정된다.
top , right , bottom , left 의 값으로 위치를 지정한다.

profile
현재 개발 중인 블로그로 내용들을 개선하면서 업데이트하고 있습니다. https://www.plu457.life/

0개의 댓글