Question

我有一个像这样的图像：link我希望图像的大小总是＆＃34;真实＆＃34;，通常我不会使用图形因为我＆＃39 ;我无法做到这一点，但对我的一个客户来说这是一件很重要的事情。我想这取决于图像的dpi ...所以我要求设计师用不同的dpi设置制作一些图像，然后他给我发了一个链接。但它的尺寸不合适。你能告诉我一些有关这方面的信息吗？即使这是可能的事情..

（抱歉我的英语一如既往，我正在学习！）

Answer 1

浏览器在处理图像时通常不会处理“真实”尺寸;他们使用像素。

作为一个kludge，您可以存储某种类型的数据库（没有像SQL那样复杂，除非您已经在使用它; JSON或XML会这样做），其中包含URL和真实的图像大小。然后你可以做类似的事情：

var image = document.getElementsByTag("img")[0];
var true_size = lookup(image.getAttribute("src"));
image.style.width = true_size["width"] + "in";  // Or whatever unit
image.style.height = true_size["height"] + "in"; // Or whatever unit

如果您可以使用style=""属性在服务器端执行此操作，那就更好了！

添加<meta>标记，找到here，应该会使模拟的in与真正的屏幕宽度相对应：

<meta name="viewport" content="target-densitydpi=device-dpi" />

对此的支持差异很大（或者我听说过）所以它可能不起作用，但它应该足以满足此请求，因为它指示 Web浏览器在正确的宽度和高度。

Answer 2

使用css高度和宽度。

高度和宽度可以设置为自动（这是默认值。表示浏览器计算高度和宽度），或者以长度值指定，如px，cm等，或者以百分比（％）为单位包含块。

以真实尺寸显示图像

2 个答案: