木桶布局的实现原理

一、定义

高度相同，而宽度不一样的布局

二、实现原理

1、首先设置一个基准的高度，将图片以一定的宽高比压缩至该高度内的第一行。
2、将图片水平依次放满第一行，当空间不够时，将前面的图片作为一个整体，拉伸至其宽度刚好可以撑满容器。
3、之后多余的图片，就放到第二行，重复上述步骤，以此类推

image.png

参考 https://zhuanlan.zhihu.com/p/28466291