Position

Yooncastle·2021년 4월 8일

static

default
차례대로 왼쪽에서 오른쪽, 위에서 아래로 쌓임

relative

태그를 기존 static이었을 때의 위치를 기준으로 이동할 수 있음

  • top
  • right
  • bottom
  • left

속성을 사용해서 위치 조절 가능
각각의 방향을 기준으로 태그 안쪽 방향으로 이동

absolute

relative의 기준이 static이었을 때의 위치라면
absolute의 기준은 static 속성을 가지지 않은 부모 기준

부모중에 static 속성이 아닌 태그가 없다면 body 기준

fixed

스크롤과 상관없이 고정

absolute와 fixed의 경우 width가 100%가 아니게 됨

fixed element 바로 뒤에 오는 element가 있을 경우 이 element의 위치를 지정했을 때 fixed element에 반영된다. 따라서 fixed element의 위치는 top,right,bottom,left로 지정해서 사용한다.

출처

https://www.zerocho.com/category/CSS/post/5864f3b59f1dc000182d3ea1

profile
기억보단 기록을

0개의 댓글