본문 바로가기

Front-End/ETC

CSS Position 에 대하여

Position


static | absolute | relative | fixed | inherit 의 다섯가지 속성을 가짐



static


- position 속성 값으로 아무 것도 지정하지 않는 경우 기본값으로 사용됨.

- CSS 의 Normal-flow(BFC, IFC) 로 계산됨.



absolute


- 부모 요소가 absolute 이거나 relative 일때까지 거슬러 올라가 offset-parent 를 찾아 계산함.

- CSS 의 Normal-flow 계산 대상이 아님.



relative


- offset 에 따라 배치되며, offset 은 top, left, right, bottom 속성 값을 가짐.

- offset 값을 설정하지 않으면 static 과 동일한 기능을 수행함.



fixed


- 화면 스크롤과 관계없이 항상 화면의 정해진 위치에 고정되어 보여짐.



inherit


- 부모 요소의 position 속성을 물려받음.

- IE7 까지는 지원하지 않음.