我应该在图像周围放置段落标签吗？答案

【问题标题】：Should I put paragraph tags around images?我应该在图像周围放置段落标签吗？
【发布时间】：2011-01-10 05:04:30
【问题描述】：

我有一个网页，其中有带图像的文本。我写了一些文字（在一个段落中），然后放一张图片，然后是另一个段落。

我也应该在图像周围放置 p 标签，还是应该将其与 img 标签放在中间？

我问这个的原因是因为到目前为止我只是在段落之间插入图像，但现在如果我想添加多个图像或添加图像和锚点，那么不要坐在一起正确。我尝试的另一件事是添加

<p></p>

在两张图片之间，但我觉得那是错误的：P

【问题讨论】：

【解决方案1】：

您可以使用 CSS 使图像充当块而不是内联块：

将以下内容放在您的 CSS 中的某处：

img { display: block; }

或者，如果您有一些图像要内联显示，则将class="block" 添加到您的 img 标签中，并将 css 更改为：

img.block { display: block; }

【讨论】：

【解决方案2】：

将图像样式化为块元素是一种部分解决方案。 HTML 也应该被设计成没有样式也可以“工作”。如果盒子模型要求块元素只包含块元素或内联元素——不混合——那么我们应该在尽可能低的级别上这样做。这就是为什么菜单被创建为列表而不是链接集的原因。这称为优雅降级。

所以恕我直言，如果旁边的节点是块元素，则应该在图像周围添加

标签

。

【讨论】：

【解决方案3】：

我想不出你为什么不使用<img/>，如果这是你想要的布局。这样标记清楚地描述了布局。

这肯定比更改所有图像的显示类型更清晰。最好的选择是创建一个 CSS 类 img.block {display:block;} + <img class="block"/>

【讨论】：

【解决方案4】：

无论有没有，图像都没有错。您应该记住的唯一事项是：

 的 CSS 可能会以您不希望的方式影响图像的内边距、边距或宽度。
 将使图像显示为块状。
如果这是您的唯一目的，我建议您将该规则包含在您的 CSS 中作为 img {display: block;} 并让您的 <img> 不显示 
如果您网站上的图片混合了块元素和内联元素，我建议为每个元素创建一个类并指定img {display: block;} 和img {display: inline;}

【讨论】：