我如何消除CSS中内联元素之间的间距？

这个问题在这里已经有了答案：

如何去除内嵌块元素之间的空间？ 32个答案

---

尝试添加img {margin:0;padding:0;float:left}

换句话说，为img删除任何默认margin和padding浏览器并将它们float 。

演示：http://jsfiddle.net/PZPbJ/

---

如果你出于某种原因想要这样做：

没有使用float s，并且;

而不会折叠HTML中的空白（这是最简单的解决方案，以及它的价值，Twitter正在做什么）

你可以使用这里的解决方案：

如何去除内嵌块元素之间的空间？

自那以后，我对它进行了细化。

请参阅： http : //jsfiddle.net/JVd7G/

letter-spacing: -1px是为了修复Safari。

div {
    font-size: 0;
    letter-spacing: -1px
}

<div style="margin: 0; padding: 0; border: 0;">
    <a href="/view/foo1"><img src="http://dummyimage.com/64x64/444/fff" alt="Foo1" /></a>
    <a href="/view/foo2"><img src="http://dummyimage.com/64x68/888/fff" alt="Foo2" /></a>
    <a href="/view/foo3"><img src="http://dummyimage.com/64x72/bbb/fff" alt="Foo3" /></a>
</div>

---

最简单的解决方案不会妨碍布局并保留代码格式：

<div style="margin: 0; padding: 0; border: 0;">
       <a href="/view/foo1"><img src="foo1.jpg" alt="Foo1" /></a><!--
    --><a href="/view/foo2"><img src="foo2.jpg" alt="Foo2" /></a><!--
    --><a href="/view/foo3"><img src="foo3.jpg" alt="Foo3" /></a>
</div>

链接地址: http://www.djcxy.com/p/89265.html

上一篇: How can I eliminate spacing between inline elements in CSS?

下一篇: How do I remove extra margin space generated by inline blocks?