[면접준비] px, em, rem, vw, vh 설명과 각 차이점

모두 CSS에서 사용하는 길이 단위입니다.

CSS에서 길이단위는 크게 절대길이단위와 상대길이단위로 나눠 볼 수 있습니다.

px은 절대 길이 단위로 다른 요소들의 크기와 상관없이 항상 고정된 값을 가집니다.

em은 상위 요소의 글꼴 크기에 비례해 변하는 값입니다.

rem은 root요소의 크기에 비례해 변하는 값입니다.

vw와 vh는 각각 뷰포트 크기의 1/100크기를 의미합니다.

%는 부모 엘리먼트 크기의 %를 의미합니다.