<div id="head-ads">
<img id="ad-home-head-1" src="images/blank-ad.png" />
<img id="ad-home-head-2" src="images/blank-ad.png" />
</div>
这就是 html 代码。 这两个图像应该在同一行上彼此相邻出现，它们之间没有任何空白。 我的 CSS 是这样的，这两个内联图像之间没有边距或填充。 然而，两个图像之间出现了 3 个像素的空白区域。
现在，当我删除 HTML 文件中的换行符时：
<div id="head-ads">
<img id="ad-home-head-1" src="images/blank-ad.png" /><img id="ad-home-head-2" src="images/blank-ad.png" />
</div>
3 像素的空白消失。
所以我想可能存在字符编码问题或其他问题。 但是HTML文件被保存为UTF-8，这也是页面被定义为使用的：
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
关于为什么在浏览器中查看时，HTML 代码中的换行符会在图像之间添加三个像素的空白区域的任何想法？ 这已经在Mac OS X上的FireFox和Chrome中观察到。
这些文件是WordPress主题的一部分。 但这是我从头开始创建的主题，所以HTML和CSS是我100%知道的。 这很简单。 我不知道PHP或WordPress是否在做一些奇怪的事情。 但我对HTML的理解告诉我，在代码中添加换行符不应该在浏览器中增加空格。
#head-ads DIV 中写font-size:0。
#head-ads{
font-size:0;
}
img{
vertical-align:top;
}
尝试
#head-ads img {
border: 0;
display: block;
margin: 0;
padding: 0;
float: left;
}
还要确保图像本身没有空间