如何为元素设置物理尺寸（如实际英寸）？答案

【问题标题】：How to set physical dimensions (like actual inches) for elements?如何为元素设置物理尺寸（如实际英寸）？
【发布时间】：2022-05-16 18:57:11
【问题描述】：

我的最终目标是在每个屏幕上显示相同大小的图像（是的，我确实需要这个）。

我开始阅读有关如何获取用户屏幕尺寸 here 的信息 - 答案似乎是不可能的（不调用试图根据某些参数猜测实际设备的 API）。

然后我记得 css 具有用于调整元素大小的物理尺寸单位，并决定在我的屏幕上进行测试。我这样设置尺寸：

<div style = "background-color:black; height: 5in; width: 3in;"></div>

然后将物理的 3"x 5" (7.6cm x 12.7cm) 抽认卡贴在屏幕上。

它的大小明显不同。

有趣的提示 - 以毫米为单位的设置尺寸被荒谬地关闭了 - 我希望得到与英寸相同的结果。

话虽如此，有没有办法做我需要的？

【问题讨论】：

【解决方案1】：

在 CSS 中，一英寸不等于一物理英寸。它等于 96 像素。

规范的这一部分可能会对您有所帮助：

绝对长度单位相互之间是固定的，并且锚定到一些物理测量。

如果锚单位是像素单位，物理单位可能不是匹配他们的物理测量值。

或者，如果锚单元是物理单元，则像素单元可能不会映射到整个设备像素

【讨论】：

【解决方案2】：

我正处于 beta 测试的后期阶段，在这里 this.Device 对此问题有一个可靠的答案。这是一个纯粹的数学解决方案，不需要数据库。我很想知道它是否适合你。

【讨论】：