如何把 px 转换为 rem？

在 px 字段中输入像素值，然后读取 rem 字段。rem 是该值除以根字号，因此在默认 16px 基准下，16px 是 1rem，24px 是 1.5rem。

如何把 rem 转换为 px？

在 rem 字段中输入值，然后读取 px。rem 转 px 是该值乘以根字号，因此在 16px 基准下 2rem 是 32px。

转换器使用什么基准字号？

它默认使用 16px，即标准的浏览器根字号，你可以在「根字号」字段中更改它。该基准驱动每个 rem、em 和 % 的结果，使它们与你的样式表一致。

为什么这里 1pt 等于 1.3333px？

CSS 将 1pt 定义为 1/72 英寸，1px 定义为 1/96 英寸，因此 1pt = 96/72 px = 1.3333px。这就是为什么 12pt 恰好转换为 16px，即常见的正文字号。

em 和 rem 有什么区别？

rem 相对于根字号，而 em 相对于元素自身的字号。为简化起见，本工具对两者使用同一个基准，因此它们读数相同；请设置根字号来模拟 rem 一侧。

转换是在服务器上完成的吗？

不是。CSS 单位转换完全在你的浏览器中用普通算术完成，因此你输入的值留在你的设备上。

CSS 单位转换器

在你的浏览器中实时转换 CSS 长度单位——px、rem、em、pt 和 %。设置根字号，每个单位即时更新。

每次转换都在你的浏览器本地计算；你输入的值绝不会上传。

在处理 CSS 颜色？试试 CSS 颜色转换器。

关于 CSS 单位转换器

这款 CSS 单位转换器会把你在某个单位中输入的长度，同时转换为所有其他 CSS 单位——px、rem、em、pt 和 %。在任意字段输入一个值，其余字段就会实时更新，因此你无需手动计算即可读取 px 转 rem 或 pt 转 px 的结果。一个根字号输入框（默认 16px）驱动 rem、em 和 % 之间的关系，这与浏览器根据页面字号解析相对单位的方式一致。内置的快速参考会列出设计师常复用的常见 px 转 rem 值——12、14、16、24、32 等——基于你选定的基准值。每个结果都有复制按钮，可直接放进样式表。一切都在你的浏览器中运行，因此你输入的值留在你的设备上。

功能特性

在任意字段输入时即时在 px、rem、em、pt 和 % 之间转换
可配置的根字号驱动 rem、em 和 %，使结果与你的 CSS 一致
使用 CSS 的 96/72 系数进行精确的 pt 转换（1pt = 1.3333px）
将 % 视为根字号的一个分数，正如基于字体的相对 CSS
基于你的基准值的常见 px 转 rem 值（12、14、16、24、32）快速参考表
将结果修剪到合理精度并去除末尾的零，得到整洁的数值
每个单位都支持一键复制，并包含单位后缀
在多次访问之间记住你上次的数值和基准字号

如何使用 CSS 单位转换器

如果根字号不同于 16px 的浏览器默认值，请先设置它。
在任意单位字段中输入一个值——px、rem、em、pt 或 %。
查看其余每个单位的等价值，它们会实时更新。
点击某个单位旁的复制按钮，获取带后缀的数值。
使用快速参考表查看基于你基准值的常见 px 转 rem 对照。

示例

输入

/* root font-size: 16px */
.card { padding: 24px; }

输出

.card { padding: 1.5rem; }

/* 24px = 1.5rem = 18pt = 150% at base 16px */

在 16px 基准下，24px 等于 1.5rem——很适合把布局切换到 rem。

常见错误与故障排除

px 是对的，但 rem 和 % 的结果看起来不对。 — 检查根字号。rem、em 和 % 都相对于该基准解析，因此请把它设为与你 :root 或 html 元素上的 font-size 一致。
pt 与你在设计工具中看到的不一致。 — 本转换器使用 CSS 定义，即 1pt = 96/72 px（1.3333px）。印刷或 DTP 工具可能假设 72dpi，那样 1pt = 1px。
em 和 rem 显示相同的数字，但你以为它们应当不同。 — 为简化起见，本转换器对两者使用同一个基准。在真实 CSS 中，em 相对于元素自身的字号，而 rem 相对于根，因此只有当某个父元素改变 font-size 时它们才会分歧。
把根字号留空时字段被清空了。 — 空或为零的基准被视为无效；转换器会回退到 16px。请输入一个正数，自行驱动 rem、em 和 %。

常见问题

如何把 px 转换为 rem？: 在 px 字段中输入像素值，然后读取 rem 字段。rem 是该值除以根字号，因此在默认 16px 基准下，16px 是 1rem，24px 是 1.5rem。
如何把 rem 转换为 px？: 在 rem 字段中输入值，然后读取 px。rem 转 px 是该值乘以根字号，因此在 16px 基准下 2rem 是 32px。
转换器使用什么基准字号？: 它默认使用 16px，即标准的浏览器根字号，你可以在「根字号」字段中更改它。该基准驱动每个 rem、em 和 % 的结果，使它们与你的样式表一致。
为什么这里 1pt 等于 1.3333px？: CSS 将 1pt 定义为 1/72 英寸，1px 定义为 1/96 英寸，因此 1pt = 96/72 px = 1.3333px。这就是为什么 12pt 恰好转换为 16px，即常见的正文字号。
em 和 rem 有什么区别？: rem 相对于根字号，而 em 相对于元素自身的字号。为简化起见，本工具对两者使用同一个基准，因此它们读数相同；请设置根字号来模拟 rem 一侧。
转换是在服务器上完成的吗？: 不是。CSS 单位转换完全在你的浏览器中用普通算术完成，因此你输入的值留在你的设备上。