如何在HTML中并排放置两个或更多图像？

Question

假设我有2个图像，我想将它们并排放置，它们之间有一些空格，我该怎么做？我听说过关于浮动的事情？它是什么以及我将如何使用它？

Answer 1

我认为你的意思是否则会相互叠加？将两张图片浮动float:left;，如果您希望它们之间有间隙，请使用Margin或Padding。

Answer 2

通常图像的行为就像向左浮动一样，所以当nicael指出时，你可以将它们放在一起。或者您可以使用第一个答案中所述的style="float:left;"。另一方面，image元素有一个很好的align属性，允许以这种方式进行操作：

<p>Some Text above</p>
<img src="http://urlref.at/images/3o.gif" align="left" />
<img src="http://urlref.at/images/3o.gif" align="left" />
<img src="http://urlref.at/images/3o.gif" />
<p>Some Text underneath</p>

然后你不会把对齐放在最后一张图像中，所以文字会在下面而不是图像旁边。

要对图片进行空间处理，您可以使用vspace和hspace属性：

<p>Some Text above</p>
<img src="http://urlref.at/images/3o.gif" align="left" hspace="20" />
<img src="http://urlref.at/images/3o.gif" align="left" hspace="20" />
<img src="http://urlref.at/images/3o.gif" hspace="20" />
<p>Some Text underneath</p>

更清洁，但更复杂的是使用普通的CSS样式。