CSS_em & rem

<!-- px  절대적인 유닛에는 픽셀을 많이 사용-->
<!-- em /rem 상대적인 유닛에는 퍼센트와 뷰포트에 관련된 em 과 rem 이 많이 사용된다. -->

<!-- 오늘은 이 em / rem 을 언제쓰는지 알아보자 -->
<!-- 그럼 언제 쓰냐? -->

<!-- 첫번쨰로 나누는 기준은 -->
<!-- 부모요소의 사이즈에 따라서, 사이즈가 변경이 되야 된다면, % 퍼센트나 em 같은
아이를 사용하면된다. 그러나 부모와는 상관없이, 브라우져 사이즈에 대해서
반응해야 된다면, 뷰포트나 rem 을 사용하면 된다.
 -->

<!-- 두번째 기준 -->
<!-- 요소의 너비와 높이에 따라서, 사이즈가 변경이 되야된다면,
 퍼센트 %나 뷰포트 v* 같은 애를 사용하면되고,

 폰트사이즈에 따라서, 사이즈가 변경이 되야된다면,
 em 과 rem 을 사용하면 됩니다. -->

 <!-- em  =  relative to parent element
 rem = relative to root element 

 어떤게 더 낫다 라는 그런 개념이 아니고,
 어떤 디자인 인지에 따라서, 기능에 따라서 갈리기때문에,

 예제>
 좋아요 버튼 만든다고 예를들면,
 버튼의 글자를
 
 만약
 rem 을 쓰면,
 rem 은 루트의 요소 , 즉 루트에 있는 폰트사이즈를 따르기때매, 
 즉, 페이지의 상위요소 body 의 크기사이즈를 따름
 그래서항상 body 사이즈라서 크기가 일정함.
 
 만약
 em을 쓰면,
 상위는 상관없고,
 부모요소를 따르기때매,
 body 를 따르지않고 
 부모요소의 사이즈를 따른다. -->
 

 <!-- 예시 -->
  
 <!-- em -->