我的应用程序使用 rem 值。我如何将其与像素相关联？答案

【问题标题】：My application uses rem values. How can I relate this to pixels?我的应用程序使用 rem 值。我如何将其与像素相关联？
【发布时间】：2014-12-28 15:45:57
【问题描述】：

我的浏览器宽度是 1440 像素，我想制作一个比浏览器屏幕宽度小一点的元素。所以只是比 1440px 小一点。

有人可以向我解释像素与 rem 的关系吗？我的浏览器如何决定以 rem 为单位的像素数？

【问题讨论】：

stackoverflow.com/questions/11799236/…
试试calc(100% - 10px)
像素与rem 相关的方式取决于根元素的字体大小。这直接来自rem 的定义。所以不清楚你真正在问什么。要使元素略小于 1440 像素，请将其设置为 1439 像素。如果您以rem 为单位进行设置，它将始终取决于根元素的字体大小，最终始终取决于浏览器及其设置。

标签： css

【解决方案1】：

为什么不改用%？ rem/em 是相对于字体大小而非屏幕大小的单位。

在您的情况下，您可能想要这样做：

width: 95%;

或

width: calc(100% - 10px);

取决于您的具体需求。

【讨论】：

【解决方案2】：

有人可以向我解释像素与 rem 的关系吗？我的怎么样浏览器决定一个rem单位的像素数？

rem 代表 root-em，它是根元素的字体大小。在 HTML 中，根元素是 <html>。 UA 通常将16px 的font-size 应用于html，因此在这种情况下1rem 将等于16px。

5.1.1. Font-relative lengths: the ‘em’, ‘ex’, ‘ch’, ‘rem’ units

除了“rem”（指根元素的字体大小）之外，字体相对长度是指元素的字体度量它们被用来[...]

rem unit 等于根元素上“font-size”的计算值。

当在根元素的“font-size”属性上指定时， “rem”单位是指属性的初始值。

而font-size的初始值为medium。

【讨论】：

除非您更改了浏览器设置中的默认字体。