所以我发现了一堆无法以正确方式显示的图像。
我们有这个非常简单的例子:
<body>
<img src="http://vignette2.wikia.nocookie.net/runescape2/images/4/47/Santa_hat.png/revision/latest?cb=20111128052051" />
</body>
虽然在浏览器中运行此代码段时它会调整大小,但此特定图像具有(或应该具有)尺寸 28x23。
我认为这些图片存在一些格式问题,导致我无法按真实尺寸显示它们。
我实现此功能的唯一方法是分配自定义属性 width
和 height
,但问题是我使用 JavaScript 动态加载这些图像,所以我没有这些图像的尺寸。我试过检索尺寸,例如参见这个 SO 答案:
Get width height of remote image from url
但这给出了网页加载后显示的缩放尺寸(200x164?)。
我不确定为什么会发生这种情况以及如何使用正确的尺寸加载这些图像。
此外:将其放入 jsfiddle ( link ) 确实似乎使用了正确的尺寸。
编辑:(我正在编辑它以便它可以得到一个凸起)
最佳答案
您可能有一些站点范围的 img css 属性。您可以为所有这些图像标签分配一个像图像加载这样的类,并有一个 css 属性来强制它们对高度和宽度使用自动。
.image-load { height : auto !important; width: auto !important; }
关于javascript - 图片 URL 在页面加载时调整大小,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34598338/