今天完成的事情：

1.做完了任务5并按照html以及css规范修改完毕（psd.2是任务6的内容）

计划完成的事情：

1.着手做任务6

2.任务6完成后会停下来，将之前的代码重新修改一遍，尤其是在代码的规范性以及准确性方面。

遇到的问题：

1.关于昨天提到的页面设置margin=0仍然存在margin的问题，再加上html{margin=0}表现正常了，师兄说的reset还没了解（此处尴尬）。

2.观察到gif演示页眉header滚动时始终位于页面首部，故设fixed，而后面使用绝对定位背景覆盖了header，百度之，是因为游览器默认后面的覆盖前面的，加上了z-index属性解决。

3.开始未对背景所在div设置定位，仅仅对背景div内的小div设置绝对定位，结果这些小div相对与整个页面进行定位，卡了不少时间。

4.在使用table作为下半部分布局时，gif中的蓝色和灰色竖线难以实现，因为不存在div，而table默认的border竖跨整个单元格，（蓝色是元素，绿色时padding，仅能调节padding左右属性。）解决的思路有，一可以对"|"以span标签夹住，对其进行字体颜色设置，只是比较像而已，但实际上还是字，成果展示里蓝色竖线就是；二，以div标签将文本夹住，重新设定padding和margin，通过border来做到，这个并不准备提交就没有加上，灰色竖线是没有的。

收获：

1.证明这条路可以走通的，解决问题的方法也不止一种，

2.了解了绝对定位的寻找父元素的规则，绝对定位更像是一种相对定位，是相对于父元素的定位，若父元素不是的话则继续寻找祖父元素，直至整个页面。

最后附上代码和展示。

ps刚发现edge游览器显示位置与chrome不同。