Grid 布局基础概念

CSS Grid 布局是一个二维的布局系统，它可以同时处理行和列，是目前最强大的 CSS 布局方案之一。与传统的布局方式和 Flexbox（一维布局）相比，Grid 布局可以轻松创建复杂的网格结构。

基本术语

• Grid 容器（Grid Container）：设置了 display: grid 的元素
• Grid 项目（Grid Item）：Grid 容器的直接子元素
• Grid 线（Grid Line）：构成网格结构的分界线
• Grid 单元格（Grid Cell）：网格中的最小单位
• Grid 区域（Grid Area）：由多个 Grid 单元格组成的矩形区域