什么是网格布局 网格布局能够将网页划分成一个个网格，亦可以组合任意不同的网格。 grid布局是二维布局，而flex布局则是一维布局。grid将容器划分为行和列，产生单元格，通过指定项目所在的单元格。 定义网格布局 定义网格布局很简答，通过display即可设置。 不过与flex布局不同的是，单纯的设置后是无效果的，需要同样为其设置网格布局属性才可以看到效果 gridinline-grid容器内部设置为网格布局，容器为块级元素 123div{ display: grid;}容器内部设置为网格布局，容器为行内元素 123div{ display: inline-grid;} 网格布局属性 列宽和行高 定义列宽grid-template-columns和行高grid-template-rows用于规定单元格的大小。（类似于width和height） 12345678.container { /* 定义网格布局 */ display: grid; /* 定义三列网格，宽度为200px */ grid-template-c ...