position
: CSS에서 position 속성은 요소의 위치를 설정할 수 있습니다.
ex)
{ position : absolute; top: 20px; left : 50px; }
: 부모태그의 위쪽에서 20px, 왼쪽에서 50px 떨어진 위치에 배치
static (기본값)
: 흐름에 따라 배치
relative
: 일반적인 흐름에 따라 배치
top, right, bottom, left 속성을 사용하여 요소의 위치 이동
absolute
: 일반적인 흐름을 제거, 부모 요소의 위치를 기준으로 배치
- 상위 태그를 기준으로 위치를 정함
- absolute 값이 적용된 태그는 독립이 됨
- 만약 모든 태그가 absolute값을 가진다면 전체 문서의 높이값은 0이 됨
fixed
: 화면 특정 위치에 고정
inherit
: 부모 요소의 position 속성 값을 상속
absolute와 relative의 관계
: absolute는 left, right, top, bottom을 지정하여 relative에 맞춰서 위치가 선정
relative가 없으면 상위요소에 맞춰서 위치가 선정