关于 em 的 CSS 问题？答案

【问题标题】：CSS question about em?关于 em 的 CSS 问题？
【发布时间】：2011-07-24 19:18:12
【问题描述】：

我正在尝试将我网站的所有边距值转换为 em 来代替像素，但我很难弄清楚“em”到底是什么。我认为这是基于用户浏览器设置（默认字体大小）的设定距离，但是例如，当应用于 h1 或 ul 时，标准 1em 是不同的。有什么帮助吗？

【问题讨论】：

【解决方案1】：

em 基于字体大小（大写 M 的宽度高度），因此它是一个相对测量值，基于适用于元素的任何字体大小。

<div style="font-size:2em">2em<div style="font-size:2em">2em</div></div>
<div style="font-size:14px">2em<div style="font-size:2em">2em</div></div>

【讨论】：

那么我如何使 h1 边距和 p 边距具有相同的差异（使用 em）？谢谢
它是否与M within 元素的宽度有关？所以font-size 的元素，增加它的宽度/高度？
@jake，除非 h1 和 p 是完全相同的 font-family、font-size 和 font-weight （即使你可以近似它们，用户设置也可能不同）来自您建议的 CSS！）标题或段落的大写“m”是 1em ..如果您想要精确测量，请使用像素
@Blender，是的，它和 font-family 一样，然后也可能会有继承因素。. 不是每个 h2 一旦继承就可能是相同的实际宽度，即使它已经被赋予相同的 em 宽度 - 一旦你开始添加插入的代码，它们和百分比真的是一场噩梦，它们继承的比你想要的多;)

【解决方案2】：

"1em 等于当前字体大小。2em 表示当前字体大小的 2 倍。例如，如果一个元素以 12 pt 的字体显示，那么 '2em' 是 24 pt。'em'在 CSS 中是一个非常有用的单元，因为它可以自动适应读者使用的字体”

【讨论】：

【解决方案3】：

此处为 Stackoverflow 相关 EPIC 答案： Is sizing fonts using "em" still relevant?

em 度量类型将取决于具体情况（元素父级、元素类型/元素 css 属性），请在此处阅读完整而全面的说明：

【讨论】：