认识
2023年01月16日
一、认识
网格布局Grid 是最强大的 Css 布局方案。它将网页划分成一个个网格，可以任意组合不同的网格，做出各种各样的布局。以前，只能通过复杂的 CSS 框架达到的效果，现在浏览器内置了。
Preview
二、区别
2.1 Grid 与 Flex 的区别？
相同点: Grid 布局与 Flex 布局有一定的相似性，都可以指定容器内部多个项目的位置。
不同点:
-
Flex布局是轴线布局，只能指定项目针对轴线的位置，可以看作是一维布局 -
Grid布局则是将容器划分成行和列，产生单元格，然后指定项目所在的单元格，可以看作是二维布局
三、核心
采用网格布局的区域，称为容器（container）。容器内部采用网格定位的子元素，称为项目（item）。