使用CSS删除图像之间的空间

Question

假设：

<img src="..."/>
<img src="..."/>

结果是两张图像之间只有一个空格。似乎正常行为是将任意数量的空格，换行符和制表符显示为单个空格。我知道我可以做到以下几点：

<img src="..."/><img src="..."/>

OR

<img src="..."/><!--
--><img src="..."/>

OR

<img src="..."/
><img src="..."/>

或任何其他数量的黑客攻击。有没有办法用CSS删除那个空格？ e.g。

<div class="nospace">
    <img src="..."/>
    <img src="..."/>
</div>

Answer 1

在CSS中创建display: block。

Answer 2

几乎无处不在的简单方法是在容器上设置font-size: 0，前提是您没有任何需要设计样式的后代文本节点（尽管在需要时覆盖它是微不足道的）。

.nospace {
   font-size: 0;
}

jsFiddle

您也可以将默认display: inline更改为block或inline-block。请务必使用workarounds required for＆lt; = IE7（可能还有古老的Firefox）来inline-block工作。

Answer 3

我发现的最佳解决方案是将它们包含在父div中，并为该div提供0的字体大小。

Answer 4

我更喜欢这样做

img { float: left; }

删除图像之间的空间

Answer 5

我发现对我有用的唯一选择是

font-size:0;

我也在使用overflow而white-space: nowrap; float: left;似乎搞砸了