css - 有没有办法欺骗浏览器的分辨率/返回视网膜图像？

Question

我很好奇 CSS 如何确定媒体查询条件！这篇很棒的 CSS-Tricks 帖子展示了一些条件，例如设备像素比和最小分辨率。

有没有办法让浏览器欺骗/假装具有更高的分辨率？在不触及相关网站上的代码的情况下执行此操作是理想的（例如，可能会影响 iFrame 以测试在视网膜设备上查看 cnn.com 时会发生什么）。

在没有设备的情况下调试/测试会非常方便。

Answer 1

我开始以不同的方式做这件事。这有点hacky，但我喜欢它！

@media 
(height: 999px),
(-webkit-min-device-pixel-ratio: 2),
(min-resolution: 192dpi) {
     .wrapper {background:url(img/image@2x.jpg);}
}

我指定了触发媒体查询的特定高度。对于生产，我删除了媒体查询的一个条件。