在外面玩了一会儿，回到家就11点50了。。又一次要错过Webpack了。。这个还是需要一段时间的用心做demo以及认真专心的看书的。。时间不多，就继续看一篇书签中想看的文章吧。

先看的是这篇，是张鑫旭大神的CSS相对定位|绝对定位(五)之z-index篇

1. 首先z-index只在position不为static的时候才会起作用。
2. z-index值越大，css层级所处也就越上。

上述这两个应该都知道，也就不多说了。

在读文章的时候我觉得有一句话非常深入人心

N多个z-index之后，网站前端换人之后，页面的z-index层级混乱了，为了让新添加元素上面显示，不惜设置z-index的值为999或是9999等。这就好比球队，人人都想当老大，最后结果是个很有味道的屎。

虽然话不算好听，但是现在确实就是这么个情况。我们项目的模态框用的是bootstrap的modal，可是在这个名为modal的class上是自带一个z-index=1050的，以至于之后的我们想在上面显示的确认框、消息提示等的z-index都大于1050，很多直接写在了9999这个数值上。同时一些乱七八糟的东西影响下，在项目中z-index相当混乱了。

改进方案是检查一下使用了z-index的地方，能不使用就不使用。

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

借用一句话：

泛滥的z-index既浪费代码，又不利于后期维护和他人接受，为何不扔掉呢。记住，这个世界上本没有z-index。

另外尽量将那些需要浮动在上面的归个类，尽量只简单实用1，2，3即可，顺便分个类，只要让需要在上面的显示在上方即可，这样还更方便，代码也更易读。

顺便推荐另一篇文章元素重叠及position定位的z-index顺序