<resolution>

<resolution> CSS 数据类型，用于描述分辨率在媒体查询中，表示输出设备的像素密度，即其分辨率。

在屏幕上，单位与CSS 英寸、厘米或像素相关，而不是物理值。

语法

<resolution> 数据类型由一个严格为正的 <number> 后跟下面列出的单位之一组成。与所有 CSS 尺寸一样，单位文字和数字之间没有空格。

单位

dpi: 表示每英寸的点数。屏幕通常包含 72 或 96 个点/英寸，但打印文档的 dpi 通常要大得多。由于 1 英寸为 2.54 厘米，因此1dpi ≈ 0.39dpcm。
dpcm: 表示每厘米的点数。由于 1 英寸为 2.54 厘米，因此1dpcm ≈ 2.54dpi。
dppx: 表示每个 px 单位的点数。由于 CSS in 到 CSS px 的 1:96 固定比率，1dppx 等效于 96dpi，这对应于 CSS 中显示的图像的默认分辨率，如 image-resolution 所定义。
x: dppx 的别名。

注意：虽然数字0无论单位如何始终相同，但不能省略单位。换句话说，0 无效，不代表 0dpi、0dpcm 或 0dppx。

示例

在媒体查询中使用

css

@media print and (min-resolution: 300dpi) {
  /* … */
}

@media (resolution: 120dpcm) {
  /* … */
}

@media (min-resolution: 2dppx) {
  /* … */
}

@media (resolution: 1x) {
  /* … */
}

有效分辨率

96dpi
50.82dpcm
3dppx

无效分辨率

72 dpi     Spaces are not allowed between the number and the unit.
ten dpi    The number must use digits only.
0          The unit is required.

规范

规范
CSS 值和单位模块级别 4 # resolution

浏览器兼容性

BCD 表格仅在浏览器中加载