3
在使用flex-flow的flex容器中，更喜欢收缩而不是增长：行包装
显示具有以下规格的不同尺寸图像和比例的图像库： 图像之间没有空白（边距）。 尽可能尊重原始比例。 链接包围的图像。 非JS解决方案。 图像可能会被裁剪。 便携式解决方案。 显示的图像集是随机的。 图像必须从左到右显示（防止使用列）。 我通过以下flexbox解决方案实现了这一目标： 显示代码段 section { display: flex; flex-flow: row wrap; justify-content: center; } section a { flex: auto; } section img { height: 100%; width: 100%; object-fit: cover; } <!DOCTYPE html> <html lang="en"> <head> <title>Controlling flex growability</title> <meta name="viewport" content="width=device-width,initial-scale=1"> <style> </style> …