07-定位 z-index

z-index属性目前只有在使用定位 position:relative、position:absolute 、position:fixed 参与的情况下才有作用，表示层级，类似 photoshop 中层级的概念。

z-index层级越高，内容越应该在最上面显示。

position属性中的“后来居上”这个显示规则是没有兼容性问题的，所以，要想一个元素上面显示，直接放后面就可以了，无需z-index。

absolute 使用可以不要 relative，当然，也可以不使用 z-index。在默认情况下，元素应用了非 static的position 属性后，其就会有一个隐晦的层级，会居于普通元素之上，无需额外设置z-index 属性值。

如何避免z-index层级的混乱：
1. 分门别类。将z-index分为两派，分为“普通元素”和“遮罩层元素”。
2. . 应用1, 2 ,3规则。用于普通元素遮罩元素及组件

对 position 的理解：
一种CSS数据类型，2D坐标空间，用来设置相对盒子的坐标。
值支持1~4个值，可以是具体数值，也可以是百分比，也可以是left, top, right, center, bottom关键字。

如果偏移没有相应的关键字，则会被认为是center, 因此，background-position:top center可以直接写作background-position:top。

如果同时出现3个值或4个值，则表示可以指定偏移的相对位置，这是CSS3新特性，ie9+及以上的浏览器才支持：如 background-position: right 40px bottom 20px;