Grid布局
1.什么是Grid布局
Grid
布局即网格布局,是一种新的 CSS
布局模型,比较擅长将一个页面划分为几个主要区域,以及定义这些区域的大小、位置、层次等关系。号称是最强大的的 CSS
布局方案,是目前唯一一种 CSS
二维布局。利用 Grid
布局,我们可以轻松实现类似下图布局:
1.更灵活的排版方式:Grid 布局可以对网页进行更加灵活的布局设计,允许多列和多行的布局,且支持在不同 列和行的交叉位置进行对齐。
2.简化HTML结构:相比传统的 float 布局,Grid 布局可以减少HTML结构中的div和class的使用。
3.更容易实现响应式布局:Grid 布局基于强大的网格系统设计,支持自适应布局与媒体查询等
grid 是一个 CSS 所有网格容器的简写属性,可以用来设置以下属性:
-
显式网格属性&