Grid布局--auto-fit

.container {
    display: grid;
    grid-gap: 5px;
    grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
    grid-template-rows: repeat(2, 100px);
}

• auto-fit：自适应数量，栅格将会根据容器的宽度调整其数量。它会尝试在容器中容纳尽可能多的100px宽的列。
• minmax()：定义的范围大于或等于 min， 小于或等于 max。因此，现在每列将至少为 100px。
• 如果有更多的可用空间，栅格布局将简单地将其均分给每列，因为这些列变成了 fraction 单位，而不是 100px。