今天完成的事情：
1，完成任务7，对照ui图修改了小瑕疵,可以提交任务审核了。
2，完成wiki个人主页相关内容

明天计划的事情：
1，通过任务7 的审核。
2，开始做任务8，先分析任务8三个页面大概的布局，做好大致规划，然后开始做第一个页面

遇到的问题：
1，今天先继续完成任务7的第二个页面，由于昨天已经完成了一大半，所以第二个页面剩下的部分就是修改插入的音频audio的样式，百度之后发现想修改audio默认的样式需要用到js，所以只能通过将audio的默认样式隐藏起来，然后将播放暂停键与插入的img重叠来实现点击图片能播放音频的效果（img是假的，隐藏的audio才是真实的，这太不真实了）如图

这里使用了opacity标签来将audio样式隐藏，学会了这个标签的用法。

2，开始做任务7第三个页面。
第三个页面相对第二个页面比较简单，先做header以及footer。

遇到了padding-right不起作用的情况，百度学习

 https://www.jianshu.com/p/0c1b0406330f  

之后，找到了解决方案，但是其中的原理还是似懂非懂，有待深入研究。

3，在进行上图白色文字的布局中需要使用空格，先用&nbsp，发现空格的空间不是很好控制，然后抱着试试看的心态百度一下，果然有其他样式的空格
 
   HTML提供了6种空格（space entity），它们拥有不同的宽度。 
  非断行空格（ ）是常规空格的宽度，可运行于所有主流浏览器。其它几种空格（ 、 、 、‌、‍）在不同浏览器中宽度各异。

4，在底部footer部分根据任务要求要实现半透明的效果，一开始使用opacity：0.5；标签，发现整个footer部分都成了半透明，即便给button设置opacity：0！important；也没有用，后来百度找到了rgba这个标签，根据百度介绍这个是比较新的标签，目前兼容性还不太好。。

使用

background-color: rgba(41, 189, 224, 0.5);

就可以实现footer半透明而button不受影响了。关于颜色的三色数值，可以用过PS来提取。

5，最后是修改昨天日报提到的遗留问题，根据师兄的建议将相关模块的宽度从90%设置成100%，这样可以避免子元素从多层父元素继承宽度导致的冲突，但是此时出现了上面第2点的问题，给各级父元素设置box-size：border-box；也没有效果，又研究了一下第2点中提到的文章，还是找不到问题出在哪里。
后来跟师姐一起研究了这个问题，发现是给该子元素设置width：100%；的时候又给他设置了padding：15px；，此时padding：15px 15px 15px 15px;中的上下两块是正常起作用的，左右两块在width：100%的同时又往两边撑开了15+15=30px，导致样式在显示上有错误。所以这还是一个很基础的问题，而不是什么两个标签不兼容起冲突了有bug之类的，还是属于盒子模型中父子元素之间的关系没理解到位。

收获：
任务7完成的时间比较长，收获的东西关乎到各方面。
一是学习诸多新标签的使用，二是遇到了新的问题不知道怎么解决，深度学习之后，对已掌握的知识有更深刻的认识，从而再去解决问题，这个过程能带来快乐。