grid-area:上 左 下 右

grid-area简写与等价原写法

grid-area的简写，与等价写法

grid-template-areas  命名

grid-area

--给grid item 进行命名以便于使用grid-template-areas属性创建模版时来进行引用

语法

grid-area:<name> | <row-start> / <column-start> /  <row-end> / <column-end>;

参数说明

<name>:grid-template-areas中定义的命名。

<row-start> / <column-start> /  <row-end> / <column-end>:可以是数字，也可以是网格线的名字。