即使我设置了HTML字体大小，REM大小仍未更新

Question

我已将html和body设置为15px。

在此之后，我将某个元素的填充设置为1rem，这应该相当于15px。但实际上它给了我16px...

任何想法为什么？

--

浏览器：Google Chrome。MacOS。
CSS：Stylus
框架：Vue.js + NUXT

- mesqueeb

---

是的。这些截图来自检查器。它们没有被覆盖。 - mesqueeb

当您定义1rem时，应该给您1rem而不是15或16个像素。看起来16个像素在其他地方被定义了。 - Gerard

我刚刚写了 "padding 1rem;" 这是你看到的屏幕截图中间的那一行。其余的是计算样式。 - mesqueeb

我无法重现你的问题。这个fiddle 报告padding为15px。你能提供一个[demo]来演示这个问题吗？另外，你使用的是哪个浏览器和操作系统？你的屏幕dpi密度是多少，你是否放大或缩小了等等。 - Mr Lister

@mesqueeb，如果你在浏览器设置中设置了/定义了最小字体大小，就会出现这种情况，例如：https://ibb.co/gqRZqo - Danield

Answer 1

答案是还要设置以下内容：

：

:root {
    font-size: 15px;
}

- mesqueeb

---

不，html 在 HTML 文档中与 :root 完全相同。没有任何区别。或者说，不应该有任何区别。如果您在特定情况下检测到差异，请告诉我们具体情况！ - Mr Lister

@MrLister 我更新了有关我的浏览器的更多信息的问题。不幸的是，我无法在codepen中重新创建问题……我不确定为什么。 - mesqueeb

@MrLister，这里有一个具体性的区别。根据W3规范，根元素的优先级高于HTML标签。我现在在移动设备上，但很快就会给你链接。 - soulshined

@soulshined 和 BoltClock，我承认我错了。这并不能解释为什么 OP 会使用 :root 和 html 得到不同的结果，除非有更多的 CSS 参与其中。这可能是事实，并且也是为什么很难在 CodePen 中重现问题的原因。 - Mr Lister

我同意@MrLister，也许是第三方库，或者甚至是一个隐藏的!important我们不知道。虽然这个答案并没有错，但对于未来的问题寻求者来说有点误导。当你怀疑时，根据:root去解决问题就是所学到的教训吧 :/ - soulshined