html - html img 标签有错误 - FF 显示问题

Question

我正在使用 Html img 标签如下：

<img src="url_to_some_pic" alt="alternative error message"
    width="300" height="300">
</img>

如果 URL 损坏，Chrome 和 IE 在图像原点维度内按预期显示此错误消息但 FF 不是。

FF 中发生的情况是 FF 显示错误消息，但在一行中而不是在图像区域 (300 x 300) 内。

任何人都知道如何解决这个问题？

我猜 css 将是解决方案，但如何？

谢谢，

约翰。

score 0 · Accepted Answer

每个浏览器都以自己的方式处理 alt，并且没有一致的方式来格式化它。我会考虑将您的图像放入容器中。

至少这种方式 alt 将始终放置在左上角。

HTML：

<div id='image'>
    <img src="url_to_some_pic" alt="alternative error message" width="300" height="300">
</div>

CSS：

#image {
    width: 300px;
    height: 300px;
    border: 1px solid black;
}

score -1 · Accepted Answer

你有一个标记错误。img 标签是一个自动关闭标签。你应该这样使用它：

<img src="url_to_some_pic" alt="alternative error message"
width="300" height="300" />

那应该可以解决您的问题。但是，也许很高兴知道为图像添加宽度和高度的更好、更标准的方法是使用 CSS，如下所示：

<img src="url_to_some_pic" alt="alternative error message"
style="height: 300px; width: 300px;" />

2 回答 2