Google Font size 10.5 px (.5) the correct way and

2020-03-31 22:46发布

问题:

I am using Google font Open Sans and if I set the font to font-size 11px it looks big for the text I need and if I set it to 10px it looks small so I tested just for fun and set it to 10.5px and it works on Chrome tested 10,5px with , and it does not work.

Is this correct that we can set values of font size to example:

10.1px or 10.2px or 10.3px or 10.5px ? or is that incorrect or new css or beta something?

I really would like it to work like 10.5px because is exactly the font-size I need but reading and reading I find nothing about it.

If this works is it supported by all browsers and cellphones ?

回答1:

Basically, the answer is that no, it is not a good approach if you want to make sure that your font renders precisely in a cross-browser fashion. There is no such thing as a half-pixel when it comes to rendering the font, so you leave yourself open to different browser-applied rounding effects which could differ from browser to browser and between client devices, which have different resolutions and pixel densities.



回答2:

Convert your font size to a scalable unit like em or rem, and you can get what you are looking for.

By default, 1rem = 16px. so 10.5px = 0.65625rem.

The added benefit is accessibility. Some users may increase their default font size. Your text will scale accordingly if you use em or rem units. Pixel sizes won't.



回答3:

Use percentage instead, you won't get the same size on different displays/browsers, but you should get more control over the size of your text.

e.g: font-size: 98%;

This article may help.



标签: html css fonts