输入代码中的返回行导致输出中元素之间的间隙/空白？

Question

  

可能重复：
  Ignore whitespace in HTML

我正在尝试将图片放在网页上。这是我的HTML：

<img class="pt" src="Yellow Tulip.jpg" title="Yellow Tulip" alt="Yellow Tulip" />
<img class="pt" src="Pink Tulip.jpg" title="Pink Tulip" alt="Pink Tulip" />
<img class="pt" src="Purple Tulip.jpg" title="Purple Tulip" alt="Purple Tulip" />

但是，在我的网页上，这显示了每张图片之间的差距。我注意到，一旦我删除使元素分离且可读的返回线，而只是将所有元素放在一行上，间隙就会消失。

<img class="pt" src="Yellow Tulip.jpg" title="Yellow Tulip" alt="Yellow Tulip" /><img class="pt" src="Pink Tulip.jpg" title="Pink Tulip" alt="Pink Tulip" /><img class="pt" src="Purple Tulip.jpg" title="Purple Tulip" alt="Purple Tulip" />

无论如何我可以实现后者的输出，但仍然有代码/输入看起来像前者？我非常喜欢返回行（输入空格）带给代码的可读性，但我不想要它在实际页面上创建的空白。如果有人能解释为什么会这样和/或如何解决它，我真的很感激！ ：）

Answer 1

您可以浮动图像，例如

#container img { float: left }

或设置容器字体大小以使空间成为隐藏

#container { font-size: 0 }