There's 没有直接的方法获取以英寸为单位的屏幕尺寸，但有一些解决方法可以使用屏幕密度来查找设备尺寸。它并不完美，但您实际上不需要知道精确到 5 位有效数字的大小。此外，在我看来，通常最好简单地使用像素值。
HTML
制作一个测试 div，然后查看显示的像素数以获得像素密度，然后在计算中使用它。假设您的浏览器/操作系统配置正确（它在这个问题但在我的电脑上它在半英寸之内）。
编辑：这是100%错误的。 CSS 中的英寸/厘米测量值并非基于实际的物理测量值。它们基于精确的转换（1 英寸 = 96 像素，1 厘米 = 37.8 像素）。我很抱歉。
CSS
检测物理屏幕尺寸的最佳方法是使用 CSS 媒体查询。这min-resolution and max-resolution查询可用于获取任一解决方案dpi or dpcm:
@media (min-resolution: 300dpi){
// styles
}
将其与min-device-width and max-device-width查询，您会得到类似以下内容：
@media (resolution: 326dpi) and (device-width: 640) and (device-height: 960){
// iPhone
}
问题是，如果您想针对 7 英寸设备，则必须有许多分辨率和相应的宽度，这可能会变得复杂。
了解更多信息：
- MDN-CSS 媒体查询
- MDN-分辨率
- “移动化”指南
-
可变像素密度的高 DPI 图像（有些相关）
JavaScript
您可以使用window.devicePixelRatio以确定屏幕密度。从Android的WebView参考:
The window.devicePixelRatioDOM 属性。该属性的值指定当前设备使用的默认缩放因子。例如，如果值window.devicePixelRatio为“1.0”，则该设备被视为中等密度 (mdpi) 设备，并且默认缩放不会应用于网页；如果值为“1.5”，则该设备被视为高密度设备 (hdpi)，并且页面内容缩放为 1.5 倍；如果该值为“0.75”，则该设备被视为低密度设备 (ldpi)，并且内容缩放为 0.75 倍。
然后使用它，通过将其除以像素总数来计算物理尺寸，可以通过以下方式计算window.screen.width and window.screen.height（不要使用window.screen.availHeight or window.screen.availWidth因为这些仅检测可用高度）。
了解更多信息：
- Android Webview 参考
- MDN - Screen.width
- MDN - Screen.height
- devicePixelRatio解释
