.今天完成了什么：

完成任务四头部部分，用header标签完成头部部分并设置了样式。

提前学习了flex弹性布局盒子用于任务四，了解到了及其属性，相对于布局一用一时爽，一直用一直爽。

遇到了什么问题：

接触任务四的时候在布局上也是无从下手，不知道是用什么后来学了flex弹性布局，一开始接触弹性盒子这么多属性掌握不了，后来师兄推荐玩了个游戏就一目了然了，网址是：http://flexboxfroggy.com/，若有所悟后给头部标签盒子设置了如下样式：

align-content属性定义了多根轴线的对齐方式。如果项目只有一根轴线，该属性不起作用。

center：与交叉轴的中点对齐。

justify-content:space-between;

justify-content属性定义了项目在主轴上的对齐方式，

用pace-between：两端对齐，项目之间的间隔都相等

But现在敲出的代码是这样目前的代码写的跟狗屎一样，明天接着继续优化优化！！！

这是我对任务四布局的理解，分析容易，敲的时候一脸懵逼，切图应该可以用到雪碧图，明天看下雪碧图咋整会方便点。

不知道输入栏怎么弄这么大的框的，怎么包都包不住图标这些，明天接着优化优化。

明天完成什么：

优化任务四，学习雪碧图，优化优化优化，复习巩固知识，加深对盒子布局的理解。

收获了什么：

弹性盒子flex对网页布局真的是非常灵活，任何一个容器都可以指定为 Flex 布局，而且行内元素也可以整flex布局，例如.box{display:inline-flex}想咋整就咋整，相对于传动的盒子模型依赖 display 属性 + position属性 + float属性，局限性非常大，弄个垂直居中都要捣鼓半天，对于弹性盒子直接主轴+交叉轴安排。

display ：flex 指定我要用弹性盒子的属性.默认就是水平排序了