完成了什么：

完成任务5部分；

遇到了什么问题:

在添加专业技能的样式后，发现top上面有红色空隙。询问师兄说用backgroud-image：url属性去布置背景，

于是用了background-image。但是发现图片路径已经引用正确，但还是没得显示。

询问师兄得知图片的宽高没有给他设置，随便设置了个高之后发现图片重复铺，于是添加了background-repeat：no-repeat；同时添加了size：100%使其原比例显示，但是刷新后没看到图片，才知道是没添加装它盒子的高，于是添加了psd文件的背景height：16.35rem，size虽然是图片的大小，但是还缺装它的盒子的大小，所以才需要设置高，就跟篮球拿个小杯子装不下，没法显示，所以需要设置的大的高度使图片显示出来。

后来发现html整体会横向移动，注释了很多代码排查问题，可能是我电脑bug之类的。重新打开之后正常显示。

明天计划：

完成任务5 psd1。

今天收获了什么：

成功学会点亮background-image技能属性，一开始添加背景图片是使用img src图片添加，这样发现很麻烦，定位上也不好处理。师兄点拨后让我查看下background-image的属性值。

background-image：url();这背景样式是添加到css样式中，默认情况下该图片会随着图片的大小进行横向和纵向的平铺。可以设置只在某个方向平铺repeat-x 使图片只在水平方向上平铺repeat-y 使图片只在垂直方向上平铺，也可以设置no-repeat不重复平铺，同时使用font-size设置要显示的图片大小，100%即原比例显示，但是要注意父元素盒子的大小，假如没设置宽高则有可能显示不出来。

在url中要注意路径，容易搞混，例如下图要引用的图片在image文件夹里面，而css文件则在image的同级目录里，所以正确的引路地址是background-image：url("./image/background.png");注意分号前的.的代表意思。

另外还get到新技能：当需要项目符号的时候不需要用到image，直接套用background-image即可。

设置图片为垂直居中，配合左外边距以及设置项目文字左外边距即可实现，

background: url(image.png) no-repeat left center;

，

background-size设置背景图像的高度和宽度。 

第一个值设置宽度，第二个值设置高度。 
如果只设置一个值，则第二个值会被设置为 “auto”。

例如background-size: 50px auto;

cover 
把背景图像扩展至足够大，以使背景图像完全覆盖背景区域。 
背景图像的某些部分也许无法显示在背景定位区域中。如果需要覆盖整个容器还是得使用size。

background-size: cover;