📏 CSS 单位换算
即时换算 CSS 长度单位——px、em、rem、pt、pc、in、cm、mm、%、vw、vh、vmin、vmax。设置根字号和视口尺寸即可得到准确的相对单位。
关于 CSS 单位换算
这个换算器完全在你的浏览器中运行。输入任意数值并选择其单位，即可即时看到所有其他 CSS 长度单位的等价值。相对单位（em、rem、%）会根据你设置的根字号和视口尺寸计算，从而匹配你的实际布局。
CSS 长度单位参考
- px（像素） —— 绝对单位。1 个 CSS 像素 ≈ 1/96 英寸。屏幕布局中最可预测的单位。
- em —— 相对于元素父级 font-size。2em = 父级字号的 2 倍。嵌套时会叠加。
- rem（根 em） —— 相对于根（
<html>）字号。无论嵌套多深都保持一致。 - pt（磅） —— 1 pt = 1/72 英寸。常见于打印样式表。
- pc（派卡） —— 1 pc = 12 pt。用于排版和印刷。
- in / cm / mm —— 物理单位。CSS 中 1in = 96px = 2.54cm = 25.4mm。
- % —— 相对于父元素宽度（对大多数属性）。适合流式布局。
- vw / vh —— 1 个单位 = 视口宽 / 高的 1%。非常适合全屏响应式设计。
- vmin / vmax —— 1 个单位 = 视口较小（vmin）或较大（vmax）边的 1%。
如何使用换算器
- 输入要换算的数值并选择其单位。
- 设置根字号（默认 16px——浏览器默认值）以获得准确的 em/rem 结果。
- 设置视口宽度和高度以匹配目标屏幕，用于 vw/vh/vmin/vmax。
- 在结果表中读取所有等价值，或一键复制 px / rem 值。
常用换算（16px 根字号下）
1rem = 16px·0.5rem = 8px·2rem = 32px1em = 16px（当父级字号为 16px 时）1pt = 1.333px·12pt = 16px1in = 96px·1cm = 37.795px·1mm = 3.7795px1pc = 16px
常见问题
为什么我的 em 值与 rem 不同？ em 相对于父元素字号，而 rem 始终相对于根字号。如果父级字号不同，em 和 rem 就会不同。本换算器假设父级等于你设置的根字号。
应该使用什么根字号？ 16px 是所有主流浏览器的默认值。除非你显式更改了根字号，否则使用 16px 即可。
为什么 % 基于宽度？ CSS 中，width、margin、padding 的百分比是相对于父元素宽度解析的；height 的百分比相对于父元素高度。本换算器使用宽度，这是更常见的情况。
物理单位（in、cm、mm）在屏幕上准确吗？ CSS 以 96px/英寸将它们映射为像素，与实际屏幕密度无关。它们是一致的，但在高 DPI 显示器上可能不与物理尺子完全吻合。