CSS网格布局能构建完整的二维布局。
.container {
display: grid;
}新单位：fr 效果类似 Flex元素扩大 flex-grow，为 1 时会自动根据空白空间而扩大元素大小。
.container {
display: grid;
grid-template-columns: 1fr 1fr 1fr 2fr;
}容器属性：
- grid-template-columns
- grid-template-rows
- GRID间隔 gap
- Grid容器行对齐 justify-content
- Grid容器列对齐align-content
- Grid容器格内行对齐 justify-items
- Grid容器格内列对齐 align-items
网格属性：