Firefox：当找不到图像时，它会破坏html图层

Question

在Firefox 27中，当找不到图像时，图像的高度变得像自动图像alt。 这打破了html图层（图片1）。我该怎么做才能使它与Chrome相似（当找不到图像时，高度保持原样）（图像2）

Answer 1

您可以通过CSS指定静态或最小高度，这将始终保持其尺寸和布局保持不变，

img {
min-height:300px;
}

Answer 2

根据我的经验，img应该设置属性权重和高度，因为这种情况。这些属性可帮助浏览器在呈现DOM元素之前为其创建空间。 因此，如果您的图片是100x100像素，则属性应为weight="100"，height="100"。请注意，缺少px，因为属性是以像素为单位定义的。

编辑： 刚注意到如果你想在未加载图像时隐藏某些东西，那么使用jQuery插件waitForImages。如果未加载图像，请隐藏其容器。

Answer 3

这样的东西？ $('img').wrap('<div/>').css({minHeight: '100px'});

Answer 4

为图像设置显示内联块：

img{display: inline-block;}