删除两个图像元素之间的空格字符

Question

页面上有2张小图：

<a href="link.htm"><img src="image1.jpg" /></a>

<a href="link2.htm"><img src="image2.jpg" /></a>

当它们出现在页面上时，它们不会像我期望的那样彼此紧邻出现，它们之间以空格字符显示。

我有点理解为什么会出现此空间（毕竟，标记之间它们之间存在空间），但是我不希望有空间存在。

Answer 1

正如您所指出的那样，标记中它们之间存在空白，因此呈现的文档中它们之间存在空白。

为了使对标记的更改最小，可以执行以下操作：

<a href="link.htm"><img src="image1.jpg" /></a><a
   href="link2.htm"><img src="image2.jpg" /></a>

或类似。

你可以做的另一件事是float的a元素left ，但是这可能有敲上你的布局效果。

Answer 2

图像默认情况下呈现为嵌入式元素。 这意味着它们不会忽略容器中的空格符号。 如果要消除此间隙，则可以使用float:left或display:block规则来消除空格本身，或使图像成为块级元素。 您也可以尝试使用表格单元格包装这些图像，如下所示：

<table cellspacing="0" cellpadding="0">
 <tr>
  <td><img ...></td>
  <td><img ...></td>
 </tr>
</table>

但这是1999年。