今天完成的事情

完成任务八页面二

头部底部的制作，参考页面一代码，因为是一模一样的。

中间部分的制作：先制作一个小的任务资料页面，之后使用媒体查询来适配不同设备。

将页面一和页面二使用a标签关联起来。

今天遇到的问题

问题1:  任务资料页面当鼠标放上去会出现黑色半透明背景，同时有文字形式的介绍资料，开始不知道怎么完成

分析：开始自己想法是使用hover效果来设置一个黑色的半透明背景，但是文字并不知道怎么添加上去，后来请教师兄，发现自己想法是错误的，因为添加的是背景颜色，所以当使用hover效果的时候，点击图片时整个图片都会是黑色的，背后的内容是看不见的

解决：在任务资料介绍的外部大盒子内，多使用一个盒子，和其他资料介绍的子盒子同级别，为此子盒子添加背景半透明效果，并添加文字，最后使用visibility：hidden属性来隐藏，最后使用：hover并添加visibility：visible来显示半透明背景以及文字

问题2：完成页面一和页面二跳转使用a标签，页面布局出问题，如下图

解决： 使用a标签后，给a标签设置块状元素属性

今天的收获

1.锚定位的学习

般一个复杂的页面都会有标题栏，有时页面内容太多，我们一直往下翻比较麻烦，但是使用锚定位可以很好的解决这个问题

以下是锚定位的使用：

（1）超链接用的最多，但是超链接中锚点也是被用的较多的一个功能。

>>>>先需要被跳转到的地方放一个锚点。锚点其实也是一个a标签，只是这个a标签没有href属性，只有name属性，这个name属性就是它的标识，别人要跳转过来，就是按照这个标识。

<p><a name="chapter3">第三章</a></p>

>>>>然后点击超链接的地方，写这个锚点即可，前面是#符号。

<a href="#chapter3">第三章</a>

>>>>这也是我们在很多时候发现网址后面会有#ad之类的符号，如：http://www.36kr.com/p/219420.html#ad，这里的#就是一个锚点。

>>>>一般使用在活动页面中、常见问题页面中。

（2）发邮件的链接，使用的还是蛮多的，很多网站都有。但是貌似直接点击的人很少。一般都是复制这个邮件地址，然后打开自己的邮箱写邮件，而不是直接点击。

<a href="mailto:wwwwwww@163.com">邮件给我</a>

注意：一般a标签使用后字体颜色会发生改变，如果想要改变颜色，可以在a标签内用style添加color属性。

2.页面布局，代码优化

今天对比自己的代码和别人的代码，发现自己代码量是别人的两倍，主要是因为媒体查询使用得比较多，然后还有一个没有起作用得代码，通过今天明白，以后布局页面过程中，应该提前想好布局，每一步的优先性，以免后面花费大量时间去修改代码

明天的计划

1.任务八页面三的完成

2.将三个页面所有需要的关联完成

3.反思自己的代码，很多代码都是没有用的