使用JavaScript或CSS检测窗口10缩放设置

Question

我注意到一台带有1920x1080屏幕的小型笔记本电脑，Windows 10会自动调整缩放比例。我已经看到它高达150％。有没有办法可以检测到这个？我的媒体查询不会在px中设置。

Answer 1

尝试访问window.devicePixelRatio变量。

Window属性devicePixelRatio返回当前显示设备的物理像素分辨率与CSS像素分辨率的比率。该值也可以解释为像素大小的比率：一个CSS像素的大小与一个物理像素的大小。简单地说，这告诉浏览器应该使用多少个屏幕的实际像素来绘制单个CSS像素。它

更多信息：https://developer.mozilla.org/en-US/docs/Web/API/Window/devicePixelRatio

您也可以使用CSS resolution此，更多关于这个在这里：https://developer.mozilla.org/en-US/docs/Web/CSS/@media/resolution

@media (resolution: 150dpi) { 
    p { 
    color: red; 
    } 
}