CSS 요소의 위치 지정
bottom
- 요소의 하단 위치 지정
- position 속성 값이 static인 경우 무시
- top 속성과 함께 사용하지 않는다.
- 값
크기 리터럴
left
- 요소의 좌측 위치 지정
- position 속성 값이 static인 경우 무시
- right 속성과 함께 사용하지 않는다.
- 값
크기 리터럴
right
- 요소의 우측 위치 지정
- position 속성 값이 static인 경우 무시
- left 속성과 함께 사용하지 않는다.
- 값
크기 리터럴
top
- 요소의 상단 위치 지정
- position 속성 값이 static인 경우 무시
- bottom 속성과 함께 사용하지 않는다.
- 값
크기 리터럴
position
- 요소의 포지셔닝
- 기본값 : static
- 값
relative : 상대적 포지셔닝. 본래 요소의 위치를 기준점으로 움직인다.
absolute : 절대적 포지셔닝. position이 static이 아닌 가장 가까운 부모/선조를 기준으로 움직인다. 그러한 부모/선조가 없다면 문서를 기준으로 움직인다.
다른 요소의 흐름에 영향을 미치치 않는다.
fixed : 고정 포지셔닝. 뷰포트(문서의)를 기준으로 움직인다. 화면에 떠서 움직이며 스크롤에 영향을 받지 않는다.
다른 요소의 흐름에 영향을 미치치 않는다.
static : 포지셔닝을 하지 않음. top, right, bottom, left 속성을 무시한다.
z-index
- Z축으로의 배치 순서를 설정
- position 속성 값이 static인 요소는 해당 속성 무시
- 값
정수 : 기본값 0, 값이 클수록 위로(사용자에게 가까이)배치됨