position의 속성값
static (기본값)
문서상 원래 잇어야 하는 위치에 배치됨
⛔️ 이때 top, left, bottom, right 속성을 사용할 수 없음.
즉, 위치 조정이 불가능한 기본 HTML 요소의 상태
relative
원래 있던 자리를 기준 으로 요소의 위치를 조정
absolute
절대 좌표를 기준으로 요소의 위치를 조정
📍relativer가 적용된 요소를 찾아서 절대 좌표의 기준으로 함.
만일, relative가 적용된 요소가 없다면, HTML의 바디 전체를 기준으로 잡음
fixed
viewport를 기준으로 요소의 위치를 조정
sticky
부모 요소의 좌표 기준으로 요소의 위치를 조정
스크롤을 내려가지 않았을 때는 static처럼 작동하다가,
해당요소의 위치 아래로 스크롤이 내려가면 지정한 좌표에 고정시켜 줍니다.
z-index
3차원 공간을 확장했을 때 생기는 z축 설정
z-index 값이 크면 더 앞에 위치함
z-index: auto (기본값)
z-index: 1
z-index: 9990