【发布时间】:2011-05-27 07:45:54
【问题描述】:
我想知道em 的单位是什么,以及 1em 转换为像素时是多少 (px)。我还在某处读到了一些 IE 错误,以克服应该将哪个 body font-size 设置为某些东西,但不能遵循太多。谁能详细解释一下?
【问题讨论】:
我想知道em 的单位是什么,以及 1em 转换为像素时是多少 (px)。我还在某处读到了一些 IE 错误,以克服应该将哪个 body font-size 设置为某些东西,但不能遵循太多。谁能详细解释一下?
【问题讨论】:
它是根据您的正文字体大小计算得出的。您可以使用像素到 em 转换器来准确了解您网站上的内容。
【讨论】:
EM 是与字体的磅值成比例的度量单位。
【讨论】:
【讨论】:
尽管您可能在其他地方读到过,但 em 和 px 之间没有直接关系。
正如其中一个链接所述:
“em”值是基于 在大写M的宽度上
因此,每种字体都会有所不同。窄字体可能与扩展字体具有相同的高度(以 px 为单位),但 em 大小会有所不同。
三年后编辑:
现在有很多消息来源说 1em = 字体大小(以 px 为单位)。也就是说,当你写font-size:16px,那么1em = 16px。这仍然与 Adobe 的源代码不一致(其中说 1em = pt 中的字体大小),但无论哪种情况,它都显得很奇怪; em 大小对于压缩字体来说太大了,而对于扩展字体来说太小了。
我要制作一些测试页面,自己看看。
还有:
我看到没有人(包括我)真正回答了这个问题(这有点隐藏):
我还在某处读到了一些错误,并克服了设置 body font-size 的问题
根据this page,您需要将其添加到您的css:html{ font-size:100%; }。那一页有六年了,我还没有读过(数百)个cmets,所以我不知道它是否仍然相关。
【讨论】:
此链接可以帮助您 http://jontangerine.com/log/2007/09/the-incredible-em-and-elastic-layouts-with-css
引用自那篇文章:
我们知道 1em 总是等于父元素的字体大小,因此:
1 ÷ parent font-size × required pixel value = em value对于您的书签:Pixel to ems conversion table 用于字体大小。
【讨论】:
em 基于字母 M 并且依赖于字体的 M 原则是一个经常被提及的神话! W3c em documentation 非常简洁地描述了 em 和像素之间的关系。使用字母 M 来计算字体大小至少过于复杂和不必要。
“em”单位等于计算的 'font-size' 属性的值 使用它的元素。这 例外是当 'em' 出现在 'font-size' 属性的值 本身,在这种情况下,它指的是 父元素的字体大小。它 可用于垂直或水平 测量。
以下是重点。
没有祖先放大倍数,1em 正好等于像素字体大小属性。
x-ems 或 x-percent 的祖先放大倍率意味着您只需乘以明显的比率 x 或 x/100。因此,一个简单的 java-script 循环将计算准确的字体大小,假设: (1) 没有 C.S.S 来阻止 java-script; (2) 某些祖先的字体大小设置为绝对单位。这是文档正在讨论的计算值。手工计算可以绕过 C.S.S.,但必须在祖先链中找到绝对单位。
由于 em 测量宽度,您始终可以通过创建一个 1000 em 长的 div 并将其 client-Width 属性除以 1000 来计算确切的字体大小。由于 em 舍入到最接近的千分之一,因此您需要 1000 em避免错误的像素截断。
您可能可以创建 M 原则失败的字体,因为 em 基于 font-size 属性而不是实际字体。假设您有一个奇怪的字体,其中 M 是其他字符大小的 1/3,并且您的字体大小为 10 像素。你不认为像素字体大小以某种方式保证了最大字符高度,因此 M 不会是 10 像素,所有其他字符都是 30 像素吗?
警告
【讨论】:
em 最初是用于印刷排版的度量(根据维基百科)。这里有一些需要考虑的事情:如果 em 被定义为 12pt 类型,那么 em 是 12/72 英寸的打印页面;但如果您将 em 定义为 16px,其宽度(英寸)取决于媒体的分辨率。 (注意:在移动设备出现之前,72ppi 到 120ppi 的分辨率曾经被认为是“安全浏览器”标准。)因此,当您的用户使用 300px 宽度的设备时,1em 作为 16px 是很多“不动产”。在我看来,em 度量的最佳用途是定义文本段落以有效平衡空白,而不是用于页面布局或定位。
【讨论】:
以字母“M”命名的 em 单位在排版中具有悠久的传统,用于测量水平宽度。例如,美国文本中经常出现的长破折号 (--) 被称为“em-dash”,因为它在历史上与字母“M”具有相同的宽度。其较窄的表亲 (-),经常出现在欧洲文本中,同样被称为“破折号”。
多年来,“em”的含义发生了变化。并非所有字体都包含字母“M”(例如中文),但所有字体都有高度。因此,该术语指的是字体的高度,而不是字母“M”的宽度。
来自“令人惊叹的 em 单元和其他最佳实践”https://www.w3.org/WAI/GL/css2em.htm
【讨论】: