将字体大小添加到 HTML 会覆盖我所有的字体大小

Question

如果我将字体大小添加到 html

，我的字体会出现奇怪的行为

 html {
            font-size: 10px;
        }

它将覆盖我在所有 html 标签上的所有字体大小，并使它们变小

我想将字体大小保持在 html 但我有一个 div 不会受 html 字体大小

的影响

举个例子

https://jsfiddle.net/Ldgworje/1/

尝试从 CSS 中删除 html 并尝试

我想保留 html 的字体大小，但我有一个 div 我不希望它受到 html 字体大小的影响

如您在示例中所见

希望能帮到你

Answer 1

发生这种情况是因为您使用 rem 作为字体大小。 rem 和 em 应该以这种方式工作。检查 https://kyleschaeffer.com/development/css-font-size-em-vs-px-vs-pt-vs/

如果您不想影响评分，请改用 px。

Answer 2

你所做的是在 html 字体规则 之后添加一个规则 ，然后为 div 创建一个 ID 并设置字体大小随便什么：

html {
    font-size: 10px;
}

div#fontSize {
    font-size: 14px; /*Or whatever size you want*/
}

如果要让 div 元素的字体大小与默认值相同，只需将其设置为 1em，如下所示：

div#fontSize {
    font-size: 1em; /*Sets this size to 16px, which is default*/
}

简单！只要问你是否需要 help/explanations/fiddles.