当一个元素应用1em时，它会采用浏览器的默认值（通常为16px）或其父元素的字体大小值，对吧？但是我注意到，如果我在 h1 元素中使用类似于 margin-top: 1em 的东西（没有使用重置样式表，因此，h1 被设置为 font-size: 32px），那么1em等于32px，即使它的父元素设置为font-size: 16px。
然而，使用类似于font-size: 100%的东西可以解决这个差异问题。
我错过了什么吗？
2个回答
16
当应用1em到一个元素时，它会采用浏览器的默认值（通常为16px）或其父级的字体大小值，对吗？不是这样的。它会采用基于其父级（或默认的浏览器提供的值）计算出的自己的字体大小。由于
然而，使用类似
h1的浏览器提供的字体大小为32像素，所以产生的边距为32像素。然而，使用类似
font-size: 100%的东西可以解决这种不一致。
通过在元素上设置font-size: 100%;或font-size: 1em;，您告诉它使用其父级的字体大小的100%，因此在其他任何地方设置1em作为长度将遵循该100%。- BoltClock
4
哦，那么它就是基于其继承的值。这就解释了！ - r_31415
3它基于其计算值而非继承值。有一点微妙的差别 :) - BoltClock
@BoltClock，您能否进一步解释一下这个问题？我有一个类似的理解，即em是基于浏览器默认字体大小16像素计算的。如果有W3的引用就更好了。 - Robert
@Robert Rocha：em 单位是相对于元素的字体大小，除非您指定了字体大小本身，此时它将基于其父级的字体大小。h1 的浏览器默认值为 2em，这取决于其父级，但如果您有一个仅包含 h1 元素的 HTML 文档，则 body 和 html 的默认大小为 16px，使 h1 为 32px。如果您的 h1 在具有 font-size: 2em 的 div 中，则该 2em 将加倍，并且大小将为 64px。 - BoltClock
11
1em 等于 所讨论的元素 的字体大小。因此，当与边距一起使用时，它将等同于应用边距的元素的字体大小。
- animuson
网页内容由stack overflow 提供, 点击上面的可以查看英文原文，
原文链接
原文链接
h1和h2中可能不同的情况。 - Gangula