我正在制作整页，灵活宽度的图片库。
https://weknowtoomuch.com/projects/nga/projects-grid
现在，您可能已经开始了解我正在尝试做什么。它当前状态的页面相当不错，但图像之间的空格（行中心周围的空白区域）有点太大。
我实现的方式非常简单，只需通过在左右之间交替浮动属性来分发图像。
理想情况下，我想要实现的效果更接近于此：
我尝试了一些研究，但我发现的解决方案涉及通过改变行高来拟合所有图像，我正试图避免。一些高大的图像可能还需要占用两行，这也可能不适用于更改行高技术。
我希望的是，这种算法可以让我以最小化空白的方式分发图像，并且还可以随机化白色空间块的位置。
我在这个项目中没有使用jQuery，但如果没有其他合理的方法，我可以做一个例外！
满足所有上述标准的完整解决方案也是自己实施算法的一个很好的替代方案，以防你在这个方向上有一个提示......
最后一点：一些最小的水平裁剪图像也是可以接受的。
希望得到一些提示，线索和其他有用的反馈，这有时会帮助其他人。
答案 0 :(得分：2)
奇怪的是，昨天也提出了类似的问题。在我的answer中，我提出了一个布局引擎草稿，用于调整每列的高度以实现平铺效果。
您不想调整高度，但可能会改变机制以满足您的需求。如果您没有更新高度，则可以通过在照片之间的间隙中分配剩余空间来实现理由。这可能会造成非常大的差距，看起来并不好看。或者，您可以通过以不规则的边距为代价来对行进行居中，从而实现更紧凑的外观。不过，在我看来，这看起来更好。
我创建了scrappy prototype（在IE中不起作用，还有其他问题）。它使图像居中，但您可以下载它并更改gap和center参数。
我知道这不是你问题的答案，更像是一个建议。存在用于在行上均匀分布图像的bin-packing算法。此外，双排图像的问题没有解决。
您的照片是否为任意尺寸，或者您使用的是三种或四种标准尺寸？如果是这样，可以预先计算可能的布局，然后即时应用。