支持运算 (+, -, *, /)

0

如何转换

公式:

什么是排版?
排版单位换算在平面设计、网页开发、印刷出版和用户界面设计中不可或缺。磅、派卡、em、像素和毫米之间的关系直接影响版面精度和跨媒介一致性。

应用场景:
• 印刷出版与 DTP — Adobe InDesign/Illustrator 默认使用磅和派卡;正文字体通常 9–12 pt,标题 18–72 pt,页边距以毫米或英寸设定。

示例:
• 1 磅(pt) = 1/72 英寸,约 0.3528 mm
• 1 派卡(pc) = 12 磅 = 1/6 英寸,约 4.233 mm

排版单位定义了印刷与数字界面的尺寸和间距,直接影响可读性、视觉层级与生产精度。设计师和开发者需要在磅、派卡、像素、em/rem、毫米与英寸之间持续换算,才能在屏幕显示、CSS实现与印前输出之间保持一致。

排版单位分为两大类:物理单位(与实际尺寸对应)和相对单位(依赖上下文)。物理单位包括:(pt,1 pt = 1/72 英寸,约 0.353 mm,DTP 桌面出版标准)、派卡(pc,1 pc = 12 pt = 1/6 英寸)、毫米(mm)、英寸(in)。数字单位:像素(px)依赖分辨率,96 dpi 屏幕下 1 px = 1/96 英寸,约 0.265 mm。相对单位:em 等于当前字体大小(如 16px 字体中 1 em = 16 px);rem 基于根元素字体大小。

在哪里使用?

  • 印刷出版与 DTP — Adobe InDesign/Illustrator 默认使用磅和派卡;正文字体通常 9–12 pt,标题 18–72 pt,页边距以毫米或英寸设定。
  • 网页与 UI 设计 — CSS 使用 px、em、rem、vw/vh;推荐正文字号 16 px(1 rem),行高 1.4–1.6 em,移动端最小点击目标 44×44 px(Apple HIG)。
  • 字体设计与 OpenType — 字体内部坐标以 UPM(每 em 单位数,通常 1,000 或 2,048)为基准;字形度量(上升/下降/行距)均为 UPM 的分数。
  • 中文排版 — 传统中文印刷使用号制(初号约 42 pt,五号约 10.5 pt);现代出版标准转向 pt/mm;汉字正文通常用 10.5 pt(五号)或 12 pt(小四号)。
  • 工业与包装设计 — 条形码文字要求最小 1.5 mm 高度;欧洲食品法规要求最小字号 1.2 mm(x 高度),换算约 4.25 pt。

常见转换错误

将屏幕像素与印刷点直接对应

在 96 dpi 屏幕上,1 CSS px = 1/96 英寸;在 300 dpi 打印机上,1 pt = 1/72 英寸。若将 16 px 网页正文直接输出到印刷(不换算),在 300 dpi 下仅约 1.3 mm 高,远小于屏幕视觉效果。正确做法是按目标 dpi 换算:像素数 = pt × (dpi/72)。

在 CSS 中混用 em 和 rem 导致复合缩放

em 是相对于父元素字体大小,嵌套元素会产生复合效果:父元素 1.2 em,子元素再设 1.2 em,则子元素实际字号为 1.44 倍根字号。rem(根 em)始终相对于 html 元素字号,避免嵌套复合,是现代 CSS 布局的推荐做法。

忽略高分辨率(Retina/HiDPI)屏幕的像素比

苹果 Retina 屏幕设备像素比(DPR)= 2 或 3,意味着 1 CSS px 对应 2×2 或 3×3 物理像素。图片和图标若按 CSS px 设计而不提供 @2x/@3x 版本,在高分屏上会模糊。SVG 和矢量字体可无损缩放,应优先使用。

将 DTP 磅与历史磅制混淆

现代 DTP 标准(Adobe、CSS)均使用 1 pt = 1/72 英寸(PostScript 磅)。历史上英国印刷曾用不同磅制(Didot 磅约 0.376 mm),与现代 1 pt = 0.3528 mm 有细微差异。处理旧版印刷规格时需注意核实。

快速参考表

1 磅(pt)1/72 英寸,约 0.3528 mm
1 派卡(pc)12 磅 = 1/6 英寸,约 4.233 mm
1 英寸(in)72 磅 = 6 派卡 = 25.4 mm
1 像素(px @96 dpi)1/96 英寸,约 0.2646 mm,约 0.75 pt
1 em(16px 基础字号)16 px = 12 pt,约 4.233 mm
中文五号字10.5 pt,约 3.7 mm
中文小四号12 pt = 4.233 mm
中文初号42 pt,约 14.82 mm

常见问题

网页设计中应该用 px、em 还是 rem?

三者各有适用场景。px 适用于精确控制(边框、图标);rem 适用于字体大小和间距(随用户浏览器设置缩放,有利于无障碍访问);em 适用于与组件字体大小相关的属性(如 padding: 0.5em 使按钮内边距随字号等比变化)。现代最佳实践:基础字号用 rem,组件内部间距用 em,媒体查询断点用 rem 或 px。

印刷稿的分辨率应该是多少?

印刷图像标准分辨率为 300 dpi(每英寸点数),即 118 像素/厘米。艺术品印刷可要求 400–600 dpi;报纸约 150–200 dpi;大幅户外广告牌因观看距离远,可低至 30–72 dpi。设计时按最终印刷尺寸乘以目标 dpi 计算所需像素数。

如何将 px 换算为印刷的 mm?

公式:mm = px × 25.4 / dpi。在 96 dpi 屏幕标准下:mm = px × 25.4 / 96,约等于 px × 0.2646。例如,100 px 约 26.46 mm。若目标是 300 dpi 印刷:所需像素数 = mm × 300 / 25.4,约等于 mm × 11.81。

什么是 CSS 逻辑像素与物理像素?

CSS px 是逻辑像素(设备无关像素),与设备物理像素通过设备像素比(DPR)关联。普通屏幕 DPR = 1(1 CSS px = 1 物理像素);Retina 屏 DPR = 2 或 3。window.devicePixelRatio 可获取当前 DPR。这一机制确保相同 CSS 代码在不同密度屏幕上呈现相似的物理尺寸。

来源与标准

  • 万维网联盟(W3C)CSS 规范
  • Adobe 排版技术文档
  • 苹果人机界面指南(Apple HIG)
  • 中国国家标准 GB/T 9851(印刷技术标准)

由 The Unit Hub 编辑团队审核 · 2026年3月