2. 절대 단위와 상대 단위

Lia·2023년 4월 13일
0

절대 단위: px, pt 등
상대 단위: %, em, rem, ch, vw, vh 등

글꼴 사이즈를 정할 때

  1. 기기나 브라우저 사이즈 등의 환경에 영향을 받지 않는 절대적인 크기로 정하는 경우 (px 사용)
  • 사용자가 브라우저의 기본 글꼴 크기를 크게 설정하더라도 글꼴의 크기는 항상 설정된 픽셀로 크기가 고정된 절대 단위이기 때문에 사용자 접근성이 불리함.
  • 모바일 기기처럼 작은 화면과 동시에 고해상도인 경우 적합하지 않음.
  • 기본적으로 고해상도에서는 1px이 모니터의 한 점보다 크게 업스케일 되기 때문에, 뚜렷하지 못한 형태로 출력되는 경우가 있음.
  • 픽셀은 인쇄와 같이 화면의 사이즈가 정해진 경우에 유리.
  1. 일반적인 경우
    (상대 단위인 rem 사용)
  • 브라우저의 기본 글자 크기는 1rem. 두 배로 크게 하고 싶다면 2rem, 작게 하려면 0.6rem 등으로 조절해서 사용할 수 있음.
  • 사용자가 설정한 기본 글꼴 크기를 따르므로, 접근성에 유리함.
  • rem은 root의 글자 크기에 따라서만 상대적으로 변합니다.
  • em은 부모 엘리먼트에 따라 상대적으로 크기가 변경되므로 계산이 어려움
profile
https://lia-portfolio.vercel.app/

0개의 댓글