em

em은 부모 요소의 폰트 사이즈에 대한 상대적인 크기를 나타낸다.
만약 부모 요소의 폰트 사이즈가 10px일 때, 1em = 10px, 2em = 20px를 나타낸다.

rem

부모 엘리먼트가 아닌, 최상위 루트 html 요소에 대한 상대적인 크기를 나타낸다.

vw

viewport width에 대한 상대적인 크기를 나타낸다.
viewport는 현재 브라우저에 보이는 화면 전체를 나타낸다.
100vw는 viewport width의 가로 사이즈를 전부 다 차지한다. (100%)
50vw는 viewport width의 가로 사이즈의 절반만큼만 차지한다. (50%)

vh

viewport height에 대한 상대적인 크기를 나타낸다.

vmin

viewport width 또는 height 중 작은 값에 대한 상대적인 크기를 나타낸다.

vmax

viewport width 또는 height 중 큰 값에 대한 상대적인 크기를 나타낸다.

'프론트엔드 > CSS' 카테고리의 다른 글

기본 선택자와 복합 선택자  (0) 2020.12.19

+ Recent posts