PX 转 REM 转换器

按根元素字号实时换算 px 与 rem。

基准字号px小数位数

像素px

根 EMrem

rem

常用换算（基准：16px）

表示单个设备像素的 CSS 绝对单位。提供精确、固定的尺寸。

相对于根元素的 font-size。随用户浏览器设置缩放，更利于无障碍访问。

本工具可将像素（px）值转换为 CSS 中的 rem 单位。rem 单位始终相对于根元素的 font-size（即 html 元素），因此成为响应式、无障碍设计的首选单位。设置你的根字号，输入一个像素值，等价的 rem 便会即时显示，可直接粘贴到样式表中。

多数浏览器将根字号设为 16px，因此16px = 1rem。如果你的项目更改了 html 的 font-size，请在设置中相应更新基准。

在媒体查询中更改一处根字号，整个布局便按比例缩放——无需逐个元素修改。

rem 尊重用户浏览器的字号偏好，因此对于需要更大字体的读者，文字和间距会随之增大。

由于 rem 在嵌套时从不叠加，同一个值在页面任何位置都代表相同含义。

在基准字号字段中输入你项目的根（html）font-size。默认值为 16px，即浏览器的标准基准。

选择 px 单位标签，输入要转换的像素值。rem 等价值会随输入实时更新。

rem 值会即时出现在结果面板中，并附带 em 和 px 等价值。使用小数位数设置来控制取整精度。

点击 rem 结果旁的复制按钮，直接粘贴到样式表中。

公式：rem = px ÷ 根字号。例如，24px ÷ 16px = 1.5rem。

选择合适的单位取决于你想要固定尺寸还是随上下文响应的尺寸。下面是三种单位的对比。

单位	相对于	随用户设置缩放	最适合
px	无（绝对）	否	边框、阴影、细线
rem	根字号	是	排版、布局、间距
em	父元素字号	是	组件级局部尺寸

最佳实践：字号、外边距和内边距使用 rem，让界面完全可缩放；将 px 留给永远不应变化尺寸的元素，例如 1px 边框。

以下参考值假设根字号为 16px 。在工具中调整基准即可为其他任意根设置重新计算。

基准字号是什么，为什么重要？

它是用来计算 rem 的根（html）font-size。浏览器默认将其设为 16px，所以 1rem 通常等于 16px。如果你的 CSS 设置了不同的根字号，请将此字段改为该值以获得准确的换算。

px 是如何转换为 rem 的？

用像素值除以根字号：rem = px ÷ 根。根为 16px 时，24px 即为 1.5rem。本工具会即时计算，并按你选择的小数位数进行取整。

就无障碍而言，rem 比 px 更好吗？

通常是的。由于 rem 随浏览器字号偏好缩放，提高默认文字大小的用户会获得按比例放大的界面。固定的 px 值会忽略该偏好，可能损害可读性。

元素嵌套时 rem 会叠加吗？

不会。与 em 不同，rem 始终参照根字号，因此无论元素嵌套多深，同一个 rem 值都渲染得完全一致。这种可预测性正是 rem 最大的优势之一。

转换是在我的浏览器中完成的吗？

是的。计算完全在客户端随输入进行。没有任何数据上传到服务器，因此结果即时呈现，页面加载后即可离线使用。