我有一堆我想在网页上显示的图片。每张图片都有不同的高度和宽度。我想将它们连续显示(根据浏览器窗口的宽度包裹到下一行),具有恒定的高度但固定的宽高比以防止倾斜。如何在没有任何插件或JavaScript的纯CSS3 / HTML中执行此操作?
例如,图像将显示为:
[1] [2] [3] [4]
[5] [6 ] [7 ]
[8 ] [9 ]
[10 ]
但如果浏览器宽度增加:
[1] [2] [3] [4] [5] [6 ]
[7 ][8 ] [9 ][10 ]
每张图片都有固定的高度,但宽度可能会有所不同。
我见过一堆可以做到这一点的砌体插件,但有没有办法在没有插件的情况下做到这一点?此外,我见过的大多数插件都是从上到下垂直显示内容......我有兴趣保持从左到右的顺序。