position : static, relative, absolute, fixed, sticky

main
section
article
static : HTML 문서에서 일반적인 흐름에 따라 배치됨 기본값
sticky : 요소가 HTML 문서안에서 static과 같이 일반적인 흐름에 따라가다가 스크롤 위치가 임계점에 이르면 fixed와 같이 박스를 화면에 고정할 수 있는 속성
relative : static과 마찬가지로 요소가 문서의 일반적인 흐름에 따라 배치.
static과 차이점은 요소가 자신의 static 위치에서 top, bottom, right, left 와 같은 속성에 의한 상대적인 위치에 배치됨.
absolute : 요소가 문서의 일반적인 흐름에 따르지 않게 함. position:static 속성을 가지고 있지 않은 부모를 기준으로 움직임. 만약 부모중에 포지션이 relative, absolute, fixed 인 태그가 없다면 가장 위의 태그가 기준이 됨.
fixed : 일반적인 흐름에서 제거. 대신 스크린의 뷰포트를 기준으로 한 위치에 배치됨.
즉, 스크롤되어도 움직이지 않는 고정된 자리를 갖게 됨.
위로