javascript - 使用 CSS 显示实际大小的图像

Question

我想以实际大小(真实世界大小)显示图像。我使用 mm 单位来显示实际大小的图像，但它在我的两台计算机上并不准确。这是 fiddle在我的代码中，这是一张信用卡的图片。一张信用卡的尺寸为 85.60 × 53.98 毫米，因此如果将信用卡放在屏幕上，您可能会看到它更小。

img{
    width:85.60mm;
    height:53.98mm;
}

基本上，问题是 mm、cm 和 in 单位在屏幕上无法正常工作。它们的打印版很好。实际上，这些单位似乎不像我从 W3C 得到的那样在屏幕上工作。 .

那么这个问题有什么解决办法吗？

-----编辑------

我创建了另一个可以调整信用卡大小的 fiddle 。问题可能是如何找到“比率”数字？请看fiddle here让我知道你在想什么？有什么方法可以从用户代理字符串或其他东西中找到比率编号吗？

Answer 1

在操作系统、显卡和显示器制造商都同意将物理尺寸转换为适用于用户正在使用的特定设置的像素的通用标准之前，没有办法做到这一点。

这个概念的术语是 Resolution Independence

虽然在 OSX 和 Windows 中对此有一些支持，但它绝不是完整的，仍然需要手动干预才能正确设置。

最重要的是，最终用户决定使用缩放覆盖您的测量值，无论是在 Firefox 等桌面上，还是在触摸设备上通过捏合，您都会受到影响。

所以，在这一点上，恐怕没有办法去做。