Html 使用 CSS 去除图像之间的空间
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/7641678/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Use CSS to remove the space between images
提问by steveo225
Given:
鉴于：
<img src="..."/>
<img src="..."/>
The result is two images with a single space between them. It seems that the normal behavior is to show any number of spaces, newlines, and tabs as a single white space. I know I can do the following:
结果是两个图像之间有一个空格。似乎正常行为是将任意数量的空格、换行符和制表符显示为单个空格。我知道我可以做到以下几点：
<img src="..."/><img src="..."/>
OR
或者
<img src="..."/><!--
--><img src="..."/>
OR
或者
<img src="..."/
><img src="..."/>
Or any number of other hacks. Is there a way to remove that whitespace with CSS? e.g.
或任何数量的其他黑客。有没有办法用 CSS 删除那个空格？例如
<div class="nospace">
<img src="..."/>
<img src="..."/>
</div>
回答by Daniel A. White
Make them display: blockin your CSS.
display: block在你的 CSS 中制作它们。
回答by alex
An easy way that is compatible pretty much everywhere is to set font-size: 0on the container, provided you don't have any descendent text nodes you need to style (though it is trivial to override this where needed).
一种几乎在任何地方都兼容的简单方法是font-size: 0在容器上设置，前提是您没有任何需要设置样式的后代文本节点（尽管在需要时覆盖它很简单）。
.nospace {
font-size: 0;
}
You could also change from the default display: inlineinto blockor inline-block. Be sure to use the workarounds requiredfor <= IE7 (and possibly ancient Firefoxes) for inline-blockto work.
您也可以从默认更改display: inline为block或inline-block。请务必使用<= IE7（可能还有古老的 Firefox）所需的变通方法才能inline-block工作。
回答by Dylan Richards
The best solution I've found for this is to contain them in a parent div, and give that div a font-size of 0.
我为此找到的最佳解决方案是将它们包含在父 div 中，并将该 div 的字体大小设置为 0。
回答by boodle
I prefer do like this
我更喜欢这样做
img { float: left; }
to remove the space between images
删除图像之间的空间
回答by Cole Robert
I found that the only option that worked for me was
我发现对我有用的唯一选择是
font-size:0;
I was also using overflowand white-space: nowrap;
float: left;seems to mess things up
我也在使用overflow，white-space: nowrap;
float: left;似乎把事情搞砸了
