To set the font-size to pixels is very bad.
body { font-size:10px; } /*very bad*/
for example, when they have bad sight and cannot see so good, then some people actually increase the default font size of their browser. The problem is that by doing so we actually override the browser font size setting that the user can manually change in the settings, and many people actually do that.
Now if we set the font to like, the 10 pixels as we did here, then we remove the ability for these people to see our website properly because they can no longer change the default font size.
Well, they can, but our root font-size will not be affected by that anymore.
It'll just be 10 pixels no matter what the user has a default font size so this is really bad, and that is why we're going to set over a font size to a percentage here.
Which will translate to a percentage of the font size given by the browser.
Now, the default font size, if the user doesn't change anything, which is the initial situation that we want, is 16pixels, so that's the absolute default, and that's a situation that we're counting on here.
body { font-size: 100%; } /*16px; browser default font size*/
The result, So, If we put 100% here, they would mean that the root font size would be 16pixels if the user doesn't change anything and if the user does change the default font size.
body { font size: 62.5%; } /*10px*/
'Frontend 👩🏻💻 > HTML&CSS' 카테고리의 다른 글
[HTML] #1 Hypertext Markup Language (0) | 2021.10.08 |
---|---|
[Sass] Architect : the 7 - 1 pattern (0) | 2018.07.20 |
[css] Inheritance In CSS (0) | 2018.07.13 |
[css] How UNITS are converted from relative to absolute(px) (0) | 2018.07.13 |
[css] How CSS Works? and what is Specificity? (0) | 2018.07.12 |