像素密度

像素密度是显示器单位长度上的物理像素数，以每英寸像素数（PPI）为单位。它取决于屏幕的分辨率和物理尺寸。一台 5120×2880 像素的 27 英寸显示器，对角线约为 5,874 像素，像素密度约为 218 PPI。

在相同的观看距离下，像素密度越高，文字和线条看起来越平滑。为了让界面元素保持便于使用的大小，操作系统会对它们进行缩放。macOS 以点为单位度量界面，在标准显示器上用 1×1 像素渲染每个点，在 Retina 显示器上则用 2×2 像素。

在网页中，同样的比例称为设备像素比，即每个 CSS 像素对应的物理像素数。

像素密度与显示清晰度

分辨率相同但尺寸不同的两台显示器，像素密度也不同。一块 1920×1080 的面板在 13 英寸时看起来很清晰，在 27 英寸时则显得粗糙。看到的效果并不只由像素密度决定，观看距离和缩放设置同样有影响。

像素密度如何影响截图

截图记录的是物理像素。在 2x Retina 显示器上，1600×900 点的截取区域会生成 3200×1800 像素的图像。同一区域在 1x 外接显示器上会生成 1600×900 像素的图像。如果截取会话在多台显示器之间切换，同一组截图中的图像尺寸就会变化。

截取过程中显示器配置发生变化时，Temposhot 会显示 Display Configuration Changed 对话框，并提供 Continue with Selected Display 和 Stop Capture 两个选项。

设备像素比

设备像素比	示例	400 CSS px 宽的元素
1	标准桌面显示器	400 像素
2	Mac Retina 显示器	800 像素
3	许多当前的手机	1200 像素

浏览器工具和截图库可以设置设备像素比，因此桌面电脑也能生成手机像素密度的截图。

常见错误

• 在同一份文档中混用 1x 和 2x 截图，导致部分截图看起来模糊或过大。
• 混淆显示器的 PPI 与图像中存储的 DPI 字段。
• 在网页上按完整像素尺寸显示 2x 截图。
• 以不规则的比例缩小 2x 截图，而不是正好缩小 50%。

需要反复截取相同的截图？

在同一台显示器上运行每次截取，图像尺寸就能保持一致。参阅 Mac 截图自动化。

常见问题

如何查看截图的像素尺寸？

在 Screenshot Resolution Checker 中打开截图，或者在 Mac 上使用预览的检查器。

像素密度和分辨率是一回事吗？

不是。分辨率是像素数量。像素密度是物理屏幕上每英寸的像素数。

参考资料

• Pixel density（维基百科）
• Window.devicePixelRatio（MDN）

相关资源

• 截取控制与恢复：截取过程中的显示器变化。
• DPI：面向打印的分辨率数值。