隐式与显式网格

CSS Grid 布局中，网格分为显式网格和隐式网格：

1. 显式网格

显式网格由开发者通过 grid-template-rows 和 grid-template-columns 明确定义行列数和尺寸。

css

grid-template-columns: 100px 1fr 100px;
grid-template-rows: 50px 150px;

显式网格只包含已定义的行和列。

当项目超出显式定义的网格范围时，浏览器自动创建的额外行或列，称为隐式网格。

隐式行高度和隐式列宽度由 grid-auto-rows 和 grid-auto-columns 控制。

css

grid-auto-rows: 100px;
grid-auto-columns: 150px;

未明确指定位置的项目，按照自动放置规则填充显式或隐式网格。