TIL
148. [CSS] CSS Position TIL23.04.11
새싹_v
2023. 4. 11. 22:57
728x90
static
position 속성의 기본값
요소를 문서 흐름에 따라 배치
relative
요소를 원래 위치를 기준으로 상대적으로 배치
top, right, botto, left 속성으로 위치 조정 가능
absolute
절대 위치 지정 요소
요소를 가장 가까운 부모 요소를 기준으로 배치
문서의 흐름에 영향을 받지 않음
부모 요소 중 position 속성이 static이 아닌 요소를 찾아 기준으로 삼는데,
만약 부모 요소가 없다면 body 요소를 기준으로 삼는다.
top, right, bottom, left 속성으로 위치 조정 가능
fixed
요소를 뷰포트 기중으로 고정하여 배치
스크롤을 내려도 요소가 화면에 고정되어 있음
top, right, bottom, left 속성으로 위치 조정 가능
sticky
요소를 가장 가까운 스크롤 가능한 부모 요소를 기준으로 배치
스크롤이 해당 요소의 위치에 도달하면 요소가 고정됨
top, left, right, bottom 속성으로 위치 조정 가능
특정 위치에 도달하면 아래처럼 고정됨
728x90