我正在开发一种独特的应用程序，它需要根据显示图像的设备以特定分辨率生成图像。因此，在常规 Windows 浏览器 (96ppi)、iPhone (163ppi)、Android G1 (180ppi) 和其他设备上，输出是不同的。我想知道是否有一种方法可以自动检测到这一点。
我的初步研究似乎拒绝了。我看到的唯一建议是制作一个元素，其宽度在 CSS 中指定为“1in”，然后检查其 offsetWidth(另请参见 How to access screen display’s DPI settings via javascript?)。有道理，但 iPhone 用这种技术骗我，说它是 96ppi。
另一种方法可能是获取以英寸为单位的显示器尺寸，然后除以以像素为单位的宽度，但我也不确定该怎么做。
最佳答案
<div id='testdiv' style='height: 1in; left: -100%; position: absolute; top: -100%; width: 1in;'></div>
<script type='text/javascript'>
var devicePixelRatio = window.devicePixelRatio || 1;
dpi_x = document.getElementById('testdiv').offsetWidth * devicePixelRatio;
dpi_y = document.getElementById('testdiv').offsetHeight * devicePixelRatio;
console.log(dpi_x, dpi_y);
</script>从这里抓取http://www.infobyip.com/detectmonitordpi.php .适用于移动设备! (安卓4.2.2测试)
关于javascript - 从 JS/CSS 检测系统 DPI/PPI？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/279749/