今天完成的事情： 

   修改了任务十三第一个页面的bug
明天计划的事情： 

   继续修改完任务十三剩余的bug

遇到的问题：

   当屏幕上下滚动的时候发现中间的文字会覆盖上边的图案

收获：学会了Z-index层级覆盖的用法

 先了解一下z-index的基本信息：在W3C是这样描述的：每个元素都具有三维空间位置，除了水平和垂直位置外，还能在 "Z轴" 上层层相叠、排列。元素在 "Z轴" 方向上的呈现顺序，由层叠上下文和层叠级别决定。在文档中，每个元素仅属于一个层叠上下文。元素的层叠级别为整型，它描述了在相同层叠上下文中元素在 "Z轴" 上的呈现顺序。同一层叠上下文中，层叠级别大的显示在上，层叠级别小的显示在下，相同层叠级别时，遵循后来居上的原则，即其在HTML文档中的顺序。不同层叠上下文中，元素呈现顺序以父级层叠上下文的层叠级别来决定呈现的先后顺序，与自身的层叠级别无关。z-index语法：z-index: auto(自动，默认值) | integer(整数) |  inherit (继承)z-index 接受的属性值为：关键字auto和整数，整数可以是负值。需要注意的是 z-index 虽然很给力，却只能应用于定位元素（即设置了 position 属性为非 static 值），其它情况下，z-index 将被忽略。

   什么是层叠上下文（STACKING CONTENT）在一个层叠上下文，所有的元素根据规则从下到上排列，分成了七个等级：

   1、背景和边框 — 形成层叠上下文的元素的背景和边框。 层叠上下文中的最低等级。

   2、负z-index值 — 层叠上下文内有着负z-index值的子元素。

   3、块级盒 — 文档流中非行内非定位子元素。

   4、浮动盒 — 非定位浮动元素。

   5、行内盒 — 文档流中行内级别非定位子元素。

   6、z-index: 0 — 定位元素。这些元素形成了新的层叠上下文。

   7、正z-index值 — 定位元素。层叠上下文中的最高等级

   如果两个元素都没有定位发生位置重合现象或者两个都已定位元素且z-index相同发生位置重合现象，那么按文档流顺序，后面的覆盖前面的。如果两个元素都没有设置z-index，使用默认值，一个定位一个没有定位，那么定位元素覆盖未定位元素3,如果父元素z-index有效，那么子元素无论是否设置z-index都和父元素一致，在父元素上方4,如果父元素z-index失效（未定位或者使用默认值），那么定位子元素的z-index设置生效5,如果兄弟元素的z-index生效，那么其子元素覆盖关系有父元素决定