px转rem|px、rem、pt、em、mm
最后更新:
px
rem 以此字号为基准。这里 em 和 % 也以它为基准;而在 CSS 中它们跟随父元素,所以只有在父元素没有改变字号时才与 rem 相同。
换算公式
1 px = 0.0625 rem所有结果
px 1
rem 0.0625
em 0.0625
% 6.25
pt 0.75
pc 0.0625
in 0.0104167
cm 0.0264583
mm 0.264583
速查表:像素 → rem(根 em)
| 数值 (px) | 结果 (rem) |
|---|---|
| 1 px | 0.0625 rem |
| 8 px | 0.5 rem |
| 10 px | 0.625 rem |
| 12 px | 0.75 rem |
| 14 px | 0.875 rem |
| 16 px | 1 rem |
| 18 px | 1.125 rem |
| 20 px | 1.25 rem |
| 24 px | 1.5 rem |
| 32 px | 2 rem |
| 48 px | 3 rem |
| 64 px | 4 rem |
关于px、rem和pt
CSS规定1英寸等于96 px,因此1/72英寸的1 pt等于1.333 px,1 mm等于3.78 px。rem和em是相对单位:1 rem是根元素的字号,除非访问者修改,所有主流浏览器中都是16 px,所以24 px就是1.5 rem。如果样式表把根字号设成了别的值,请在输入框上方的基准字号中填入这个值。em跟随父元素的字号,因此只有在父元素没有改变字号时才与rem相等。
常见文字和元素尺寸
以默认基准 16 px 计算。CSS 规定 1 英寸等于 96 px,所以 pt 和 mm 两列在任何基准下都不变,只有 rem 一列随基准变化。
| 尺寸 | rem | pt | mm |
|---|---|---|---|
| 10 pt 文字(脚注) | 0.8333 | 10 | 3.528 |
| 浏览器的默认文字大小 | 1 | 12 | 4.233 |
| 文字处理软件中的 12 pt 文字 | 1 | 12 | 4.233 |
| 默认 h2 标题 | 1.5 | 18 | 6.35 |
| WCAG 2.2(2.5.8)规定的最小目标尺寸 | 1.5 | 18 | 6.35 |
| 默认 h1 标题 | 2 | 24 | 8.467 |
| 1 厘米 | 2.362 | 28.35 | 10 |
| 1 英寸 | 6 | 72 | 25.4 |
磅与像素的历史
远在屏幕出现之前,字体大小就以磅来度量:铸字商需要一个统一的单位来铸造排列整齐的铅字。计算机把磅定为 1/72 英寸。
- 皮埃尔-西蒙·富尼耶发表了一张以印刷磅为单位的字号表,其标尺把英寸分为 12 行,每行再分为 6 磅。
- 美国铸字商协会为铅字字身采用了磅制,其中 nonpareil 为 6 磅,pica 为 12 磅。
- Adobe 推出了 PostScript,其页面上的长度单位是 1/72 英寸;用 Adobe 自己的话说,与印刷中使用的磅大致相同。
- CSS 2.1 成为 W3C 推荐标准。它规定 1 英寸等于 96 px 和 72 pt,因此 1 px 是 0.75 pt,并把像素的基准定为在一臂远处观看 96 dpi 屏幕时的一个点。
来源: