在HTML中添加字体大小会覆盖我所有的字体大小

Question

如果我在html中添加了font-size，我的字体就会很奇怪

 html {
            font-size: 10px;
        }

它将覆盖所有ht​​ml标签上的所有字体大小，并使它们变小

我想在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*/
}

简单！只需问一下您是否需要任何帮助/解释/小提琴。