em 是如何计算的?
我注意到你可以使用 1em 并且它在不同的网站上看起来会有所不同。
em 与什么成比例?
- 使用的字体?
- 最大的字体大小?
- 页面宽度/高度?
I have noticed that you can use 1em and it will look different on different sites.
What is an em in proportion to?
- The font used?
- The biggest font size?
- The page width/height?
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(3)
请参阅http://w3schools.com/cssref/css_units.asp
EM 相对于它定义的当前元素。如果您使用相对大小(例如
0.9em
),它们会成倍增加并可能导致意外的尺寸。现在,浏览器之间的默认字体大小不标准。将字体设置为特定像素单位时,IE(至少是较旧的 IE)存在问题。 有关字体大小的详细概述可以在 A List Apart 上找到。
See http://w3schools.com/cssref/css_units.asp
An EM is relative to the current element it is defined on. If you use relative sizes (like
0.9em
), they multiply and can lead to unexpected dimensions.Now, the default size of a font is not standard between browsers. And there's an issue with IE (at least older IE) when setting the font to a specific pixel unit. A good overview for font sizing can be found on A List Apart.
根据 W3C,em:
“等于使用它的元素的‘font-size’属性的计算值。例外情况是当‘em’出现在‘font-size’属性的值中时本身,在这种情况下,它指的是父元素的字体大小。”
换句话说,ems 没有绝对大小。它们根据所在位置采用大小值。对于大多数 Web 设计人员来说,这意味着他们使用的是 Web 浏览器,因此 1em 高的字体与该浏览器的默认字体大小完全相同。
对于大多数浏览器,默认值
1em = 16 像素
According to the W3C an em:
"is equal to the computed value of the 'font-size' property of the element on which it is used. The exception is when 'em' occurs in the value of the 'font-size' property itself, in which case it refers to the font size of the parent element."
In other words, ems don't have an absolute size. They take on their size values based on where they are. For most Web designers, this means that they are in a Web browser, so a font that is 1em tall is exactly the same size as the default font size for that browser.
For most browsers, default value
1em = 16px
em 定义为当前字体和大小中大写字母“M”的高度。
https://web.archive.org /web/20131127083352/http://www.guistuff.com/css/css_units.html
The em is defined as the height of the capital letter "M" in the current font and size.
https://web.archive.org/web/20131127083352/http://www.guistuff.com/css/css_units.html