为什么 <img> 是内联元素时需要一个高度？ [复制]

【问题标题】：Why <img> takes a height when it's an inline element? [duplicate]为什么 <img> 是内联元素时需要一个高度？ [复制]
【发布时间】：2015-01-09 10:35:26
【问题描述】：

我的浏览器显示<img> 标签是一个内联标签。 Stack 中的许多答案说 span 不接受 height 属性因为它是一个内联标签。 <img> 怎么能做到这一点？为什么不是 inline-block 元素？

【问题讨论】：

这是一个很好的问题！我以前从没想过……
img 在技术上是一个内联替换元素。所以它可以有一个宽度和一个高度：见stackoverflow.com/questions/2402761/…
见stackoverflow.com/questions/12468176/…。
img 标签是一个被替换的元素，看这里是什么developer.mozilla.org/en-US/docs/Web/CSS/Replaced_element
这个问题的答案（提到重复）不正确：不是严格的内联块元素。他是对的，是一个内联（替换）标签。 w3.org/TR/REC-html40/struct/objects.html#edef-IMG

标签： html css

【解决方案1】：

<img> 标签并不是严格意义上的内联元素，而是内联替换元素。

简而言之，这意味着<img>（以及其他元素，如<video> 或<object>，如果您仍在使用它）具有内在维度。所以 CSS 可以处理这些尺寸（以及其他属性，例如边距）。因为<img>是一个内联标签，它被自己的源文件替换（嗯，它仍然是一个内联元素）。

一些关于此的文档：

有趣的事实（我猜）：你不能用 CSS 覆盖（或简单地处理）内联替换行为到那些元素上的“正常”内联行为（当它设置为内联块时它工作时）或阻止或任何你想要的）。看这个例子：http://jsfiddle.net/s8apbbof/

【讨论】：