javascript - 使用 javascript 以英寸而不是像素为单位查找屏幕尺寸

Question

我在 SO 上阅读了很多关于以像素为单位检测屏幕尺寸的最佳方法的问题，这最终取决于分辨率以找到实际屏幕尺寸。

我知道有些移动设备的屏幕很小(比如 4 英寸)，但分辨率很高。虽然有些设备具有大屏幕(例如 7 英寸标签)，但分辨率很低。

因此，当您想要向用户显示您的页面时，您确实需要以英寸或厘米为单位的屏幕尺寸，以提供舒适眼睛的最佳 View 。

所以我问:是否可以找到以英寸而不是像素为单位的设备屏幕尺寸？我知道可以，只要我们知道分辨率! !因为我们可以从屏幕宽度和高度计算出尺寸

感谢任何想法!

Answer 1

一旦获得以像素为单位的屏幕分辨率，就可以使用隐藏的 div 计算 dpi:

<div id="dpi" style="height: 1in; width: 1in; left: 100%; position: fixed; top: 100%;"></div>

js

var dpi_x = document.getElementById('dpi').offsetWidth;
var dpi_y = document.getElementById('dpi').offsetHeight;

然后计算出以英寸为单位的分辨率:

var width = screen.width / dpi_x;
var height = screen.height / dpi_y;

Example