个人博客

测试250

1. 如果希望每一行(或每一列)容纳尽可能多的单元格,这时可以使用`auto-fill`关键字表示自动填充。

你可以通过结合`auto-fill`和`minmax`来更灵活地布局。 

例如:

```

repeat(auto-fill, minmax(60px, 1fr));

```

上面的代码效果:列的宽度会随容器大小改变,在可以插入一个 60px 宽的列之前,当前行的所有列会一直拉伸。

**注意:**

如果容器无法使所有网格项放在同一行,余下的网格项将移至新的一行。


1. `auto-fit`效果几乎和`auto-fill`一样。

    不同点仅在于,当容器的大小大于各网格项之和时,

    auto-fill将会持续地在一端放入空行或空列,这样就会使所有网格项挤到另一边;

    而auto-fit则不会在一端放入空行或空列,而是会将所有网格项拉伸至合适的大小。

注意:


如果容器无法使所有网格项放在同一行,余下的网格项将移至新的一行。

发布:2024-06-23 21:08:35

修改:2024-06-23 21:09:29

min-Blog powered by ZPHP-MIN