今天完成的事情，任务7首页，页头部分与内容部分。

遇到的问题，页头的三条横线的布局。切图的时候万万没想到，居然是三条线。用flax布局，用margin，margin会被重叠，然后尝试了用绝对定位。

感觉自己对css的掌握还是差了不少。

内容部分的布局看一眼的时候，不知道怎么样如何去上手布局。因为他左右两边是有凹陷的。用padding给左右两边设置属性。然后给父级元素设置背景颜色。主要是得把他们看做一个整体部分，一步一步布下来。

       今天遇到未解决的问题，右边的黄色图标，用背景图片做的，但是发现随着页面的拖拉，图标无法定位。代码如下，不知道是不是把背景图片设置在父级元素的原因。但是没有道理放到子级里面啊。因为背景图片在子级元素外边的。

     .guessing-word{

     display: flex;

     align-items: center;

     justify-content: center;

     height: 120px;

     background: #fff;

     background-image: url("image/task-7-2.png");

     background-repeat: no-repeat;

     background-position: 97%;

}

今天的收获，对整体布局有了一定的掌握。不会再看到ui图就头大了。

明天计划要做的事情，任务7首页做完。