多排元素排列

grid

示例

适配响应式

核心思路：

• repeat(auto-fill, minmax(100px, 1fr))

flex

示例

核心思路：

1. 通过 justify-content: space-between 均分剩余空间。
2. 最后一个元素通过 margin 自动填充剩余空间

提示

还有一种思路，通过“添加元素隐藏占位”。

差几个元素就补几个元素，然后将这些元素通过 visibility: hidden 进行隐藏。

适配响应式

配合 媒体查询，调整子元素宽度。