html - 使用 rem 调整大小时是否需要设置基本字体大小？

Question

我见过多种网络排版方法，建议将基本字体大小(在 html 或 body 元素上)设置为精确的像素值，或者百分比(例如 62,5%，以便使用 em 或 100% 轻松调整大小)。

我正在研究在使用 rem 调整字体大小时是否仍然有必要。我的想法是，当使用 > IE9 时，rem 是一种根据用户首选的基本字体大小调整字体大小的简单方法。是这样的:

• 有利于可访问性(即不覆盖用户偏好)
• 易于设计(值不会级联，整个设计可以放大或缩小，因此很流畅)

但是既然有这么多推荐，我想知道:我是否遗漏了什么？关于字体大小的当前状态是什么？我的方法是否存在可访问性问题，我没有想到的事情？只是从当前事态的 Angular 寻找处理这个问题的原始资料，而不是意见。

Answer 1

rem 基于您的 root 元素或 html 标签大小，因此建议给出一个大小。我不会怀疑“用户偏好”，因为大多数现代浏览器只会统一放大所有内容。所以黄金法则是将您的 html 大小设置为以像素为单位的基本值:

html { font-size: 12px; }

只是因为从那里很容易计算。之后，像这样设置每个后续字体值:

.element {
    font-size: 12px;
    font-size: 1em;
    font-size: 1rem;
}

它看起来相当广泛，但它允许最大的兼容性。在可访问性方面，这不是问题，因为在浏览器中增加字体大小会增加 html 中的原始 12px，随后会放大其余部分。