在使用z-index这个属性之前，我们必须先了解使用z-index的必要条件：
1、要想给元素设置z-index样式，必须先让它变成定位元素，说的明白一点，就是要给元素设置一个postion:relative(定位元素：position属性值设置除默认值static以外的元素，包括relative，absolute，fixed)样式。
2、不要给想控制“上、下”的元素设置z-index，而是对他们的父容器设置z-index样式。
看懂了以上两点，我们就明白了如何才能使用z-index这个属性，那就是我们在使用z-index前，先将元素定位，例如position:relative;然后再后面再添加z-index:2000就OK了。
当定位元素的 'z-index' 未设置时（默认为 auto），在 IE6 IE7 IE8(Q) 下将会创建一个新的局部层叠上下文。而在其它浏览器下，则严格按照规范，不产生新的局部层叠上下文。
在可能出现定位元素相互覆盖的情况时，明确指定定位元素的 'z-index' 特性，避免此问题的出现。
来源：https://www.cnblogs.com/hyql/p/5461862.html