不幸的是，换行符也算作空格字符。

我提出的最好的解决方案是在标签内部使用空白，而不是在标签外部:

  <img src="images/minithing.jpg" alt="my mini thing" 
/><img src="images/minithing.jpg" alt="my mini thing"
/><img src="images/minithing.jpg" alt="my mini thing"
/><img src="images/minithing.jpg" alt="my mini thing" />

我知道这也不理想。但至少它不是一些奇怪的CSS黑客，依赖于一个空间字符的大小被渲染或诉诸于相对定位，或JavaScript:)

哦，你可以很容易地完成这一行CSS:

#parent_of_imgs { white-space-collapse: discard; }

你会问，缺点?目前还没有浏览器实现这个非常有用的特性(一般来说是内联块)。: - (

我时常做的事是，尽管它像黑夜一样丑陋，就是使用评论:

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

这是一个简单的问题，但答案并不那么简单。

人们可以尝试避免源代码中的空格，这在CMS中并不总是可以实现，因为它们是由系统自动插入的。如果你想改变这一点，你必须深入挖掘CMS的核心代码。

Then you can try to use left floated images. But this is dangerous. At first you don't really have a control over vertical-alignment by definition. And secondly, you run into total chaos if you have so many floated elements, that they stretch over more than one line. And if you have a layout that relies on left floated elements (most of them do so today) you can even break some outer floating styles, if you clear floating after the images. This can be overridden, if you float any surrounding element. Rather not to be recommended.

因此，唯一的解决方案是使用CSS声明来处理空格处理过程。这不是任何标准的一部分(因为css3还没有完成)。

我更喜欢在HTML变体中没有空白。使用drupal作为CMS，这可以在你的template.php和主题文件中很容易实现。然后我选择内联块。

注: 在不同的浏览器中使用内联块相当复杂。 对于FF 2，你需要显示:-moz-inline-box。 其余的和IE8可以有display: inline-block后立即。 对于ie7，你需要在下面单独的声明中显示:inline(最好是通过条件注释)。

edit

我用来做一个元素内联块

elem.inline {
  display: -moz-inline-box; /* FF2 */ 
  display: inline-block; /* gives hasLayout in IE 6+7*/
}
/* * html hack for IE 6 */
* html elem.inline {
  display: inline; /* elements with hasLayout and display inline behave like inline-block */
}
/* * +  html hack for IE 7 */
* + html elem.inline {
  display: inline; /* elements with hasLayout and display inline behave like inline-block */
}

这个解决方案有什么困难之处?

css

.no-whitespace {
    line-height: 0;
    font-size: 0;
}

html

<span class="no-whitespace">

    <a href=# title='image 1'>
       <img src='/img/img1.jpg' alt='img1'/>
    </a>

    <a href=# title='image 2'>
       <img src='/img/img2.jpg' alt='img2'/>
    </a>

    <a href=# title='image 3'>
       <img src='/img/img3.jpg' alt='img3'/>
    </a>

</span>

缩小你的HTML!

在将响应呈现给浏览器之前缩小响应是一种很好的实践。

因此，除非您需要空格(并且您使用 硬编码)，否则您总是在缩小过程中删除空格。

您可以将容器的字体大小设置为0，然后空白就会消失!