브라우저 기본 글꼴 배율이 100%이고, 크기가 16px이기 때문에 16px을 기준으로 rem이 계산되는데,
브라우저 확대/축소 시 html에 고정값으로 인한 글꼴 크기 설정을 막음으로써 rem의 용도를 해침.
"Set the root HTML font-size as a percentage. That’s a percentage of the user’s default browser font-size. A typical method is to set the HTML font-size to 62.5%. That’s because 62.5% of 16px (typical default browser font-size) is 10px. That would still make 1.6rem = 16px. This now means that if the user’s default browser font-size is changed to, for example, 20px, 1.6rem would now equal 20px. So if your user wants bigger fonts, let them. Happy designer. Happy developer. All numbers are still easy to work with."
html root의 폰트 사이즈를 픽셀이 아닌 62.5%로 설정하여 사용하는 것이 일반적.
오늘도 하나 배운다 ㅋ
https://engageinteractive.co.uk/blog/em-vs-rem-vs-px
https://cafe.naver.com/hacosa/308539
'WWWEB > CSS' 카테고리의 다른 글
[ css ] position: sticky가 안 먹는 경우, 적용 조건 (0) | 2023.03.28 |
---|---|
[css] 말줄임 여러 줄 예시 (1) | 2023.02.14 |
css3 카드 뒤집기 효과 (backface-visibility: hidden;) (1) | 2023.01.31 |
CSS grid 간략 공부 (0) | 2023.01.10 |
css3 포토샵 효과: mix-blend-mode (0) | 2020.09.10 |
다크 모드 코딩 방법 ( css : prefers-color-scheme ) (1) | 2020.03.09 |
크롬에서 filter blur 이슈 관련 (0) | 2018.03.22 |
[css] placeholder color 변경 (0) | 2017.07.21 |
댓글