今天完成的事情

今天是把任务7给完成了，昨天是做到了第二个页面的主体部分中的图片，后续的内容今天还是完成的比较多的。并且昨天没遇到什么问题，今天出现的问题可能相对多一些。

明天要做的事情

明天要把任务八详细的看一下，任务八看起来会相对复杂一些，所以明天的目标是完成第一个页面和第二页面的一半吧。

今天遇到的问题

遇到的第一个问题是在audio的这个设计上，第一时间想到的是用切图给他关联一个播放控制的设置，然后一查这原来是js中的问题需要调用js的文件，在这个阶段就不选择这种方法了。之后看了人家的设计是把audio的控制项利用opacity这个透明度的设置让他隐藏在图片之中。

                <img src="images/task7-2.png" class="pic">

                <audio  src="财富自由.mp3" controls="controls" style="position: relative;

                top: -30px;left: 70px;width: 100px;

                height: 40px;opacity: 0;float:right;"></audio>

此办法确实可行，只不过因为audio控制界面有点过长所以会破坏整体的布局结构。通过师兄的讲解用到了一个旋转的属性transform: rotate(90deg);。从而很好的解决了布局的问题，在第二个界面中还用到了vw这个属性，因为不可能在每一小块都使用百分比，所以vw这个单位很好的解决了整体布局上的控制。最后一个主要的问题是在第三个页面的页首页尾使用fixed而不用absolute，fixed是对于整个页面的位置而absolute是对于上一级设了定位后的绝对位置，透明度的问题在最后的按钮位置也只是个小问题使用background-color: rgba(153, 223, 240, 0.7)；就可以解决。

今天的收获

收获到的有很多，认识了<a>标签的运用vw单位的使用方式，还有文字中的空格可以用 。雪碧图的定位和缩放等等，学无止境。