← 返回工具箱

PX ⇄ REM

PX REM CONVERT · 代码格式化

px 与 rem 双向批量换算,基准字号可调;写响应式样式、迁移设计稿尺寸时一贴即得。

输入样式文本
基准 px / 1rem(root font-size)
转换结果

>_ 使用指南 · GUIDE

px 与 rem 双向批量换算,基准字号可调(默认 16px):贴入一串数值(设计稿标注、样式表片段),全部结果一次给出。写响应式样式、把设计稿尺寸迁到 rem 体系时,一贴即得,不用逐个除 16。

支持小数结果(如 18px = 1.125rem),换算表可整体复制。纯数学换算,本地实时完成。

>_ 常见问题 · FAQ

Q1 · px 和 rem 是什么关系?

rem = root em,相对根元素(html)字号的单位:html 字号 16px 时,1rem = 16px、0.5rem = 8px。与 em 的区别:em 相对父元素字号(会层层叠加),rem 永远锚定根元素—— predictable,是现代响应式布局的主力单位。

Q2 · 为什么推荐用 rem 而不是 px?

rem 让整个页面的尺寸随用户设置/媒体查询统一缩放:改根字号一处,全页等比缩放;老年用户调大浏览器字号,rem 排版跟随放大而 px 固定不变(无障碍短板)。做响应式时媒体查询里只改根字号,就能整体切换疏密档位。

Q3 · 基准字号为什么是 16px?能改吗?

16px 是浏览器默认根字号(历史与可读性平衡的结果),不设 html{font-size} 时 rem 以它为基准。可以改:html{font-size:62.5%} 把基准调成 10px(1rem=10px 便于心算)是常见技巧,但要同步维护无障碍影响(覆盖用户偏好)。本工具基准可调,两种体系都能算。

Q4 · 设计稿的 px 标注怎么批量转成 rem?

把设计稿的一串尺寸(如 16 24 32 48)或样式片段贴进本工具,批量输出 rem 值后逐个替换。规范做法是在团队里统一约定:基准 16px、保留三位小数,转换脚本或本工具输出直接采用,避免每人手算精度不一。

Q5 · 0.5px 边框这类小数 px 怎么处理?

0.5px 是做「细边框」的常用技巧(高分屏生效、老设备回退 1px)。换算成 rem 同样成立(0.03125rem),但如此小的 rem 值可读性差、依赖根字号精确为 16。建议小数 px 原样保留,rem 化主要针对布局尺寸与字号这类「需要整体缩放」的值。

嵌入代码

把下面的代码复制到你的网页,即可将本工具嵌入为 iframe(自动隐藏导航与页脚)。

高度px
此工具在你的浏览器本地运行,输入内容不会上传。按 Ctrl K 可随时切换到其他工具。