今天完成的事情：大致写出了任务五的雏形，了解了关于background的一些缩写形式

明天计划的事情：继续进行任务五尽量完成

• 遇到的问题：ps版本不同导致切图耗费大量时间，flex实际使用不熟练花费较长时间

在最开始时页面头部只有两个元素无法直接用布局的方式来处理

解决方式用添加一个空div实现三个元素的排列布局

代码

<div class="tb">

        <img src="./images/01.png" alt="" width="10" height="17"> 

        <p>个人主页</p>

        <div></div>

    </div>

css代码

.tb{display: flex;

    justify-content:space-between;

    align-items:center;

    height: 40px; background-color: #5fc0cd;

 }

实现左边紧贴文字居中

中间抠ps背景图与资料不一致花费较长时间，最后更换版本解决

在背景图拉伸变化方面跟演示不一致

观察或发现页面缩小到一定长度背景图不在缩小

查询到有代码

min-width可以实现

故加入min-width： 320px;实现一定程度下背景不缩小

了解background可以有各类缩小让代码更为简洁

如：

background-color 使用的背景颜色。

background-image 使用的背景图像。

background-repeat 如何重复背景图像。

background-attachment 背景图像是否固定或者随着页面的其余部分滚动。

background-position 背景图像的位置。

简写方式:

background: [background-color] [background-image] [background-repeat] [background-attachment] [background-position] / [ background-size] [background-origin] [background-clip];

数值设定之后灵活使用使代码更为简洁。