html - 即使未加载图像，如何强制占用宽度

Question

我正在加载一堆 img，即使它们尚未加载或尚未完成加载，我也希望它们占用文档上的空间。

我尝试指定宽度和高度（都作为属性本身，并在样式属性中），发现如果不加载图像不会占用空间，这令人沮丧。

当然，必须有一种方法可以将 img 强制为特定尺寸，**即使该图像无法加载。

谢谢

Answer 1

肯定有：

<img src="path/to/image.png" height="50" width="20" />

此外，在style="/* css */"属性中指定宽度和高度不起作用的原因是，默认情况下，图像是内联元素。如果您指定display: block图像将接受width和height值。

如果添加到 css/style 中：

display: inline-block;

它应该工作。我不确定为什么Firefox 不尊重宽度/高度属性，但仍然如此。即使是带有定义的 IE，doctype也应该尊重display: inline-block，因为img默认情况下，元素无论如何都是内联的。

Answer 2

<div>简单的答案：用固定宽度将图像包裹起来。

<div style="width: 400px;"><img src="404.png" /></div>

如果您将填充、边框等设置为0，您将不会注意到 div 存在。