在我的网站上，我有多个具有相同高度但具有三种不同宽度的图像。我想在一个漂亮的网格中显示这些。上传图片时，我会检查图片是宽还是高。
然后，我为图像 s、m 和 l 设置了三种不同的尺寸
s 用于高图像，m & l 用于宽图像。
这些图像显示在表格中，其中小 (s) 图像占 1 个点，中 (m) 占 2 个点，大 (l) 占 3 个点。每行有3个点。
如果我可能有 8 张图像（4 高和 4 宽），我希望它看起来像这样（w = 空白）：
sss
ms
l
l
l
代替
sss
sww
l
l
l
l
这意味着前 3 张图像只是小图像。因为我需要第二行的中等图像，所以我拉伸其中一个宽图像以占据 2 个点。然后在那个旁边有一个高图像，最后三行只是三个宽图像，每行一个。
我希望我解释得足够好。
编辑：
或者假设我有 4 张 2 高 2 宽的图像（w = white-space）：
而不是像这样显示它
ssw
l
l
我希望它看起来像这样：
sm (or ms)
sm (or ms)
我该如何进行这项工作？