前言

继续上篇来讲items的属性。container的属性已经画好格子了，那么items的属性则是确定items放在哪个格子里面。感觉??一个grid布局写body？？可以解决整个网页？？

一、grid-column-start / grid-column-end / grid-row-start /grid-row-end

用横（纵）线的开始和结束确定item放在格子里。

.item-1 {
  grid-column-start: 2;
  grid-column-end: 5; // five;
  grid-row-start: 1;
  grid-row-end: 3;	//row1-start;
}

我们也可以用线的名字来写上去。

此外，还可以用span来表示"跨越"，即左右边框（上下边框）之间跨越多少个网格。

.item-b {
  grid-column-start: 1;
  grid-column-end: span col4-start;
  grid-row-start: 2
  grid-row-end: span 2
}

注意：以上可以简写，grid默认可以跨的span为1，且开始都是从左上角开始堆叠。

.item-b {
  grid-column-end: span 3;
  grid-row-start: 2
  grid-row-end: span 2;
}

grid-column-start + grid-column-end, 和 grid-row-start + grid-row-end 的简写。

直接栗子：

.item-c {
  grid-column: 3 / span 2;
  grid-row: third-line / span 1;
}

用于引用grid-template-area中区域的命名。
或者grid-row-start + grid-column-start + grid-row-end + grid-column-end的简写。

沿着行轴对齐grid item 里的内容（与之对应的是 align-self, 即沿列轴对齐）。此属性对单个网格项内的内容生效。

效果和justify-items/align-items的关键字一样，不做重述。