css rem, em 차이

참고자료

rem 단위는 문서의 최상위 요소인 html요소의 몇 배인지로 크기 결정

em 단위는 상위 요소 크기를 기준으로 몇 배를 할지를 결정

예를들어

html > body > li 구조에서

html { font-size : 10px; }

body { font-size : 1.5em; }

li { font-size : 2.0rem/em; }

이면

2.0rem의 경우, li의 폰트사이즈는 = 10px(html) * 2.0(li) = 20px라는 의미

2.0em의 경우, li의 폰트사이즈는 = 10px(html) * 1.5(body) * 2.0(li) = 30px라는 의미