在 CSS 的 font-size 属性中使用小数 em
比方说,我定义了以下 CSS 规则:
.className {
font-size:0.89em;
}
我的问题是,在为浏览器实际支持它指定 em 时,我可以对分数进行“深入”了解,并且对于 em 中的小分数变化,字体大小会以不同的方式呈现价值?
Say, I have the following CSS rule defined:
.className {
font-size:0.89em;
}
My question is, how "deep" into fractions can I go while specifying 'em's for browsers actually to support it and for the font size to be rendered differently for a small fractional change in the em's value?
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
约翰 B 是对的。无论我们使用什么尺寸单位,我们仍然以像素为单位进行渲染,ems 的微小变化不会改变显示的尺寸:
例如,对于最初以 20px* 高度显示的文本,我们可以看到,当添加了一条规则,使其成为原始高度的 0.99em:
浏览器无法显示 0.8 的像素,因此(假设它会向上舍入)它仍会将其显示为 20px 高。
尽管浏览器似乎并不总是按预期四舍五入:
http:// /meyerweb.com/eric/thoughts/2010/02/10/rounding-off/
http://ejohn.org/blog/sub-pixel-problems-in-css/
*是的,我知道 20px 的字体大小并不总是意味着它以 20px 显示!
JohnB is right. We're still rendering in pixels whatever the size unit we use, and small changes in ems will not change the displayed size:
For example, for text originally displaying at a height of 20px*, we can see that there is no effective change when a rule is added to make it .99em of its original height:
The browser can't display .8 of a pixel, so (assuming it will round up) it will still display it as 20px high.
Though it appears that browsers do not always round off as expected:
http://meyerweb.com/eric/thoughts/2010/02/10/rounding-off/
http://ejohn.org/blog/sub-pixel-problems-in-css/
*Yep, I know a font-size of 20px doesn't alway mean it's displayed at 20px!
但应该记住,小数 em 值与所有浮点数一样,容易受到舍入误差的影响。
我发现在设置媒体查询边界时,一个最大宽度与另一个最小宽度相差 0.00001em,并且它被四舍五入并且两个查询都被激活。将差异更改为 0.001em 后,查询完全按预期工作。
It should be kept in mind though, that fractional em values, like all floating point numbers, are susceptible to rounding error.
I found that out while setting my media query boundaries, where one max-width was 0.00001em away from another min-width, and it was rounded up and both queries were activated. After changing the difference to 0.001em the queries worked as expected, exclusively.