HTML 字体大小 62.5% - 如何计算行高？

Question

是这样的：

html { font-size: 62.5%; }
body { font-size: 16px; }

现在，根据设计，行高应该是64px，但我想使用em 而不是px。有没有一个公式可以让 px 变成 em 的？在这种情况下：64px 将是 1.35em）？更好 - 有没有一个 scss mixin？

希望我在这里说清楚...... :)

Answer 1

从你说的... 为什么不使用line-height: 4;，因为16*4=64 像素。如果你想在em 中使用它，你可以，因为你知道字体大小与行高的比率。记住 line-height 可以是计算的 font-size（我们在这里使用）或硬编码值的一个因素。

em 值根据父元素而变化，这就是人们将它用于响应式网站设计的原因。

您可以使用 PixelsToEm (http://pxtoem.com/) 通过提供正文字体大小将像素值转换为 em 值。

所以你的 CSS 可能看起来像这样：

body {
    font-size: 1em; /* equivalent to 16px (default font-size for browsers) */
    line-height: 4; /* equivalent to 64px */
}