是<img>元素块级别还是嵌入式级别？

我在某处读过该<img>元素的行为类似于两者。如果正确，可以有人举例说明吗？

的确，它们都是-或更确切地说，它们是“内联块”元素。这意味着它们像文本一样内联地流动，但也像块元素一样具有宽度和高度。

在CSS中，您可以设置一个元素display: inline-block以使其复制图像的行为*。

图像和对象也被称为“已替换”元素，因为它们本身不具有内容，因此该元素实际上被二进制数据替换。

*请注意，浏览器在技术上使用display: inline（如在开发人员工具中所示），但是它们对图像进行了特殊处理。他们仍然遵循的所有特征inline-block。

一个img元件是取代内联元素。

它的行为就像一个内联元素（因为确实如此），但是有关内联元素的一些概括不适用于该img元素。

例如

通用化：“宽度不适用于嵌入式元素”

什么规范竟说：“适用于：所有元素，但非替换行内元素，表格行和行组”

由于图像是替换的内联元素，因此它确实适用。

IMG元素是内联的，这意味着除非它们浮动，否则它们将与文本和其他内联元素一起水平流动。

它们是“块”元素，因为它们具有宽度和高度。但是在这方面，它们的行为更像是“内联块”。

几乎所有目的都将它们视为具有宽度设置的嵌入式元素。基本上，您可以自由决定使用CSS显示图像的方式。我通常设置一些像这样的图像类：

img.center {display:block;margin:0 auto;}

img.left {float:left;margin-right:10px;}

img.right  {float:right;margin-left:10px;}

img.border  {border:1px solid #333;}

每当您插入图像时，它都将采用图像原始宽度。您可以在其旁边添加任何其他html元素，您将看到它将允许它。这使图像成为“内联”元素。

的确，它们都是-或更确切地说，它们是“内联块”元素。这意味着它们像文本一样内联地流动，但也像块元素一样具有宽度和高度。