css - 保持图像水平对齐无间隙的最简单方法？

Question

在 div 中无间隙水平对齐图像的最简单正确方法是什么？

如果可能的话，我不想将每张图片都包装在一个 div 中，也不想使用列表。我宁愿寻找合适的 CSS 来以最少的标记实现这一目标。

最大的问题是图像之间的间隙，我可以通过将字体大小设置为 0 来删除它，这很难看并且仅适用于 Firefox。

<div class="images"><img1><img2><img3></div>

.images {
display: inline;
...???
}

Answer 1

实现此目的的一个好方法是使图像 float 。

但是，一定要给它们的父容器添加一个溢出属性，以确保它一直围绕着它们，

添加边距也会使它们整齐。

.images {
    overflow: hidden;
}

.images img {
    float: left;
    margin: 0px;
}