我正在尝试使用"分辨率"媒体查询来确定屏幕的实际DPI。
我正在做的代码看起来像这样：
window.matchMedia(`(resolution: ${value}dpi)`).matches
，但我发现此查询为true的value在两个不同的设备上是96，而不是具有相同的DPI。例如，在一台计算机上，实际DPI为157。window.devicePixelRatio在这两台机器上等于1。在第三个设备上，实际DPI为215，但是上面的查询告诉我是192(恰好是double 96(，而window.devicePixelRatio为2。
我已经看到了看起来像" @media"或" @media屏幕"的CSS媒体查询，但是如果我将任何一个都放在字符串中，我将其传递给matchMedia，无论该值是什么，它都永远不会出现。但是我觉得I 必须缺少某些东西，因为规格说resolution是要匹配屏幕的实际分辨率，而且我永远不会看到这种情况。
CSS <resolution>单位基于CSS单元，而不是实际的物理尺寸。
因此，如果我们忘记了DPI是一个打印单元，因此，当它与屏幕相关时，它应该称为PPI，<resolution>不会显示给您。
相反，本单元确实是多少pixels per CSS inch(其中pixel是您显示的最小物理点(，并且CSS inch定义为96px(其中px是魔术CSS单元，而不是任何物理事物(。
因此，您在这里拥有的仅仅只是devicePixelRatio * 96，并且不给您任何有关屏幕物理密度的信息(这需要您的浏览器知道显示的实际物理大小，这是不可能的，这是不可能的简单的事实您可以将梁投影仪用作显示(。