CSS 网格布局
阐述
用 display: grid 将元素调整为网格布局。网格是将页面的一部分区域横纵划分为长方形的格子（格子的边缘不可见），并使得各个元素占据
- 一个格子
- 多个呈长方形的格子
- 一个格子的一个部分
- 上述情况的组合
隐式网格
如果没有提供关于行数和列数的信息，则会为每个元素创建一行。可以用 grid-auto-flow: row 来改变这一行为。
显式网格
grid-templates-column：可以用百分比、绝对长度以及fr来划分空间- 在使用该模式时，多出来的子元素会创建隐式行
grid-tempaltes-row：指定各行的大小
如同 CSS 弹性盒布局一样，它也可以使用 gap 属性。