二维布局用 Grid

以下内容来自 CSS Tricks

Grid 也分 container 和 items
分别记忆

成为 container

11

行和列
12

给每条线起名字,方便后续选择

13
14

起名有啥用

  • item 可以设置范围

15

fr - free space 巧记:份

16

分区 grid-template-areas

17
18

空隙 gap

19

实践

布局

  • Grid 尤其适合不规则布局

经验

  • 等到 Grid 普及了,前端对 CSS 的要求会进一步降低
  • 目前你简单尝试一下 Grid 就可以了

12

http://js.jirengu.com/tijuk/edit

淘宝电商页面布局模仿