使用换行符时删除HTML元素之间的空格

你可以使用CSS.在图像上设置display:block或float:left将允许您定义自己的间距并根据需要格式化HTML,但会以可能适合或可能不适合的方式影响布局.

否则,您正在处理内联内容,因此HTML格式很重要 - 因为图像将有效地像单词一样.

你可以使用评论.

我担心将一系列图像并排的语义.

你有两个选择,没有用CSS做大概的事情.第一个选项是使用javascript从标签中删除仅限空白的子项.一个更好的选择是使用空格可以存在于标签内而不具有意义的事实.像这样:

Flexbox可以轻松解决这个老问题:

.image-wrapper {
  display: flex;
}

有关flexbox的更多信息:https://css-tricks.com/snippets/css/a-guide-to-flexbox/

经过太多的研究,试验和错误,我找到了一种似乎工作正常的方法,并且不需要手动重新设置子元素上的字体大小,允许我在整个doc中具有标准化的em字体大小.

在Firefox中,这非常简单,只需word-spacing: -1em在父元素上设置即可.出于某种原因,Chrome忽略了这一点(就我测试而言,无论值如何,它都会忽略字间距).除此之外,我还加入letter-spacing: -.31em了父母和letter-spacing: normal孩子们.只有当您的em尺寸标准化时,em的这一部分才是空间的大小.反过来,Firefox会忽略字母间距的负值,因此不会将其添加到字间距中.

我在Firefox 13(win/ubuntu,14 on android),Google Chrome 20(win/ubuntu),ICS 4.0.4和IE 9上的Android浏览器上进行了测试.我很想说这可能也适用于Safari,但我真的不知道......

这是http://jsbin.com/acucam的演示

我太迟了(我刚问了一个问题,并在相关部分找到了薄)但我认为显示:table-cell; 是一个更好的解决方案

唯一的问题是它不适用于IE 7和早期版本,但可修复黑客攻击

使用CSS样式表来解决此问题,如下面的代码.

[divContainer_Id] img
{
    display:block;
    float:left;
    border:0;
}

alt text http://rabu4g.bay.livefilestore.com/y1pWoAOBMiLumd2iQTAreYjQCDIkHImh2g_b2g9k4AnxtDNrCjvzL6bK7skG8QKMRNWkMG7N8e5Xm7pgle3tdRJd2y08CnnoPLy/Capture.PNG

在Firefox 3.5 Final上进行测试!

PS.你的HTML应该是这样的.