弹性布局中62.5％字体大小的目的

Question

存在将body字体设置为62.5％的做法，因此1 em将等于10 px。还知道这种方法有一些缺点。

body {
  font-size: 62.5%;
}

正如几篇文章所述，

引用表单1st article：

  

62.5％的技巧是常见的，在两种情况下确实有用：

     

  

• 您想要更简单的数学，例如，如果您正在构建弹性布局（宽度：30em; ==宽度：300px;）

  

• ＆LT; ...＆GT;

  

引自another article：

  

62.5％的Hack是常见的，有其用途和缺点。

     

如果您想要更简单的数学，我建议您使用它，例如，如果您正在构建弹性布局。

我想知道62.5％-trick究竟是如何帮助构建弹性布局的。一些简单的例子？

Answer 1

如果您使用rem设置所有填充/边距 - 这样您就可以在100％浏览器缩放时知道10rem = 10px。

Answer 2

这是一种摆脱基于像素的字体大小的方法。在显示器上考虑一个10px的字体大小，它指的是它的宽度，分辨率为3840×2160，但显示器的物理尺寸仅为13英寸。一个10px的角色将占据三分之一英寸，这是非常小的，很难看到。

我的数学可能有点偏差，但一般来说，使用非像素的字体大小意味着选择字体大小设备不可知。因此，即使在具有高和低的显示器上，字体也始终以可读的大小显示。低PPI。