1. 术语
序号 | 术语 | 描述 |
---|---|---|
1 | 网格容器 | dispaly:grid 属性定义的元素 |
2 | 网格项目 | 网格容器的直接子元素 |
3 | 网格区域 | 由一个或多个单元格组成的矩形区域 |
2. 常用属性
序号 | 属性 | 描述 |
---|---|---|
1 | grid-template-columns | 定义网格轨道中的列宽 |
2 | grid-template-rows | 定义网格轨道中的行高 |
3 | gap | 网格轨道间距 |
4 | grid-auto-flow | 项目在容器中的排列方向 |
5 | grid-auto-rows | 隐式网格单元的行高 |
6 | grid-auto-columns | 隐式网格单元的列宽 |
7 | grid-area | 定义网格区域 |
8 | place-items | 所有项目在网络单元中的对齐方式 |
9 | place-self | 某个项目在网络单元(含网格区域)中的对齐方式 |
10 | place-content | 项目在网格容器中的对齐方式 |
https://developer.mozilla.org/zh-CN/docs/Web/CSS/CSS_Grid_Layout