给定设计 (1920px x 1080px) 的 html 字体大小是多少？

Question

我有点困惑。如果我给定了模型设计 (1920x1080px)，例如段落的字体大小为 22px，h1 的值为 60px，那么要转换为 rem 的字体大小的基础应该是多少？

html {
   font-size: 18px;
}

html {
       font-size: 100%;
    }

或者我应该服用

   html {
     font-size: 62.5%
   }

Answer 1

如果按照@HaoWu 的建议，你设置

html { font-size: 62.5%; }

那么在大多数情况下，您基本上将 rem 设置为 10px，因为大多数浏览器默认将 16px 作为基本字体大小。然后很容易计算将 h1 设置为 60px 因为它只是 6rem.

如果用户将浏览器基本大小设置为其他值，偶尔会出现异常。这是他们的选择，也许是因为他们希望网站自动显示更大的文本。这意味着您不能完全依赖 1rem 为 10px。在大多数情况下，这应该没问题，因为一切都会正确成比例。

如果 rem 对你的布局很重要，通常在适当的响应式设计中它不会，那么你需要定义 html font-size in px，但最好不要，如果你能避免的话。