rem , em의 차이를 정말 알아보자
rem
무조건 root font-size에 영향받음
그래서 root font-size를 62.5%로 한경우가 픽스해놓은 경우가 많음
이렇게 되면 무조건 1.6rem -> 16px 요런 식으로 편하게 바뀌어서
그런데 사용자가 브라우저의 root fontsize 를 바꿀수도 있고 브라우저마다 root fontsize 가 달라질 수 도 잇음
아무튼 루트 글꼴 크기를 변경하는 사람들을 위해서는 px 이 아니라 rem 을 사용해야함. px 은 루트 글꼴 크기 변경에 대응되지 못함!
em
적용되는 곳의 font-size에 영향받음
만약 적용되는 곳의 font-size 가 없으면 부모의!
그럼 언제 쓰나
em 은..해당 요소의 폰트사이즈에 따라서 padding 값이나 마진이 달라질수있음. 주로 그럴 때 쓰는듯?
% 는 뭘까
%
단위는 상황에 따라 다르게 쓰일 수 있지만, 주로 부모 요소나 상위 컨테이너의 크기에 상대적으로 크기를 조절하는 데 사용됩니다.
우리 프로젝트에서는..
- 테마 설정에서 베이스 폰트사이즈를 받는다.
- 요 폰트사이즈를 root 폰트사이즈로 (px) 만든다.
- body, accent 와 같은 사이즈는 rem 값으로 고정되어있는데 당연히 베이스 폰트 사이즈에 따라서 변경이 된다!