今天完成的事情，入学，自我介绍，拍秒拍视频，交学费，和任务5的页头布局。所以今天可能要划水一点了。

遇到的问题1，任务5页头搞了这么久，很大的一部分原因可能是，任务4阶段的时候，过于松懈了，任务4做的时候就是一个div和一个div，盒子堆盒子。

脑子就转不过来弯，为什么这个盒子里面套着盒子，盒子里面还套着盒子啊？师兄看了我首页div部分都看不懂了。           

         解决办法，去尝试，之后发现html5部分就出问题了，我就像把背景颜色到父级里面，然后设置高度，在子级再去设置一次，然后把flax写入子级里面，发现没有效果就想着用padding去挤出来，缩放到300px页面就出现变形了。后面发现之写的代码全程都是错的，对布局就真的没有概念。

<div>

    <div class="top"><span class="top1">找雇主</span><span class="top2">找护工</span></div>

    <div class="top3"><img src="image/task33.png"></div>

    <div class="top4"></div>

</div>

}

.top{

    display: flex;

    align-items: center;

    justify-content: center;

    width: 100%;

    height: 60px;

    background-color: #5fc0cd;

}

.top1{

    width:100px;

    line-height: 330%;

    color: white;

    background-color: #55a8b3;

    text-align: center;

    height: 52px;

    border-radius: 10px;

 今天收获，解决了一直钻牛角的问题，盒子里面套盒子。

缩放到200px，页面依然不会变形。这就是弹性布局得好处。