今天完成的事情：

学会了网格布局

完成了页面三

grid-template-rows:（定义每一行行高）

grid-template-columns:（定义每一列列宽）

行和列的第一个属性组成第一个格子，起初以为每一个格子都需要行和列属性，

后来发现实际第一个格子组成后，后面的格子并不需要两个属性，单设置行高或者列宽就能

生成一行或一列格子，未设置的属性默认块的最高宽高，这样就可以只设置有用的格子，格子

的线条都可以得到利用。

如图ui图横线居多，需要设置多个行高，而列只需要三列就够了，然后把

需要用到的线条的格子的比例设置到和ui图相近

网格线

grid-column-start属性：左边框所在的垂直网格线

grid-column-end属性：右边框所在的垂直网格线

grid-row-start属性：上边框所在的水平网格线

grid-row-end属性：下边框所在的水平网格线

从左到右，从上到下，第一条线属性就是1，以此类推来设置元素大小

grid-column-start: 2（元素左边框纵向第二条线）

grid-column-end: 4（元素右边框纵向第四条线）

元素的长度就是第二条线和第四条线之间

grid-row-start: 2;（元素上边框横向第二条线）

grid-row-end: 4;（元素底边框横向第四条线）

元素的宽度就是第二条线和第四条线之间

锚链接

锚点目标：

<div name="test"></div>

跳转到锚点的元素

<a href="#test"></a>

名称可以随意取

明天计划的事情：

学习轮播效果

收获;

学会了网格布局和锚链接