使用 CSS 显示实际大小的图像
我想显示实际尺寸（真实世界尺寸）的图像。我使用 mm 单位以实际尺寸显示图像，但在我的两台计算机上并不准确。 这是我的代码的fiddle，这是一张信用卡的图片。信用卡的尺寸为 85.60 × 53.98 毫米，因此如果将信用卡放在屏幕上，您可能会发现它更小。
img{
width:85.60mm;
height:53.98mm;
}
基本上问题是 mm、cm 和 in 单位在屏幕上无法正常工作。它们的印刷版很好。实际上，这些单位似乎并不像我从 中得到的那样在屏幕上工作W3C。
那么这个问题有没有办法解决呢？
-----编辑------
我创建了另一个小提琴，你可以调整信用卡的大小。问题可能是我怎样才能找到那个“比率”数字？请查看小提琴并让我知道您的想法？有什么方法可以从用户代理字符串或其他内容中找到该比率数字吗？
I want to show an image in actual size(real world size). I used mm unit to show the image in actual size but it wasn't exact in my two computers.
Here is the fiddle of my code, this is a picture of a credit card. a credit card is 85.60 × 53.98 mm so if you put your credit card on screen you probably will see it's smaller.
img{
width:85.60mm;
height:53.98mm;
}
Basically the problem is mm, cm and in units are not working properly in screen. They are fine in printed version. Actually it seems those units are not made to work in the screen as what I got from W3C.
So is there any solution for this problem?
-----EDIT------
I created another fiddle that you can resize the credit card. The question could be how can I find that "Ratio" number? Please look at fiddle here and let me know what you thinking? Is there any way to find that Ratio number from user agent string or something?
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（3）
在操作系统、显卡和显示器制造商都同意将物理尺寸转换为适用于用户正在使用的特定设置的像素的通用标准之前，没有办法做到这一点。
这个概念的术语是分辨率独立
虽然 OSX 和 Windows 对此有一些支持，但它是绝不完整，仍然需要手动干预才能正确设置。
最重要的是，您会受到最终用户的摆布，最终用户决定使用缩放来覆盖您的测量结果 - 无论是在桌面上（例如在 Firefox 中）还是在触摸设备上通过捏合操作。
所以，事到如今，恐怕已经没有办法了。
There's no way to do this until operating systems, graphics cards, and display manufacturers all agree on a universal standard for converting physical dimensions into a pixels applicable to the particular set up a user is using.
The term for this concept is Resolution Independence
While there is some support for this in OSX and Windows, it's by no means complete and still takes manual intervention to set up properly.
On top of all of that, you are at the mercy of the end-user deciding to over-ride your measurements using zoom--be it on the desktop such as in Firefox or on a touch device by pinching.
So, at this point, I'm afraid there's no way to go about it.
mm 和 cm 不应依赖于像素。但为了使其正确呈现，您的浏览器必须结合屏幕直径、宽高比和分辨率。
W3C 仅推荐 mm 进行打印，因此屏幕的浏览器实现可能存在很大差异
http:// /www.w3.org/Style/Examples/007/units
顺便说一句，在我的 1920x1080 (16:9) 屏幕上效果很好
mm and cm should not be dependant on pixels. But for it to render properly your browser has to combine screen diameter, aspect ratio and resolution.
W3C only recommends mm for print so there is probably a large difference in browser implementation for screen
http://www.w3.org/Style/Examples/007/units
BTW on my 1920x1080 (16:9) screen it works quite well
我非常确定毫米和厘米取决于像素，并且像素因显示器而异。调整你的屏幕分辨率，你就会明白我的意思。
所以，我想答案是否定的。对不起。
I am pretty sure that mm and cm are dependent on pixels, and pixels vary from monitor to monitor. Adjust your screen resolution and you'll see what I mean.
So, I guess the answer is a 'no'. Sorry.