理解渲染过程和级联顺序浏览器会先绘制所有非定位元素,然后再绘制定位元素。默认情况下,所有定位元素出现在非定位元素之前。使用z-index1控制堆叠顺序。具有较高z-index的元素出现在具有较低z-index的元素前面。具有负z-index的元素出现在静态元素之后。2、z-index只对定位元素起作用,不能用来控制静态元素。3.将z-index添加到定位元素以创建堆叠上下文。堆叠上下文堆叠上下文包含由浏览器绘制在一起的一个元素或一组元素。其中一个元素将是堆叠上下文的根。例如,将z-index添加到定位元素时,它会成为新堆叠上下文的根。所有后代元素都是这个堆叠上下文的一部分。堆叠上下文之外的元素不能堆叠在堆叠上下文内的两个元素之间。堆叠上下文中元素的堆叠顺序堆叠上下文中的元素将按以下顺序堆叠,从后到前1.堆叠上下文的根2.具有负z-index的定位元素(及其子元素)3.非定位元素4.z-index为auto的定位元素(及其子元素)5.z-index为正值的定位元素(及其子元素)z-index:0会创建一个新的堆叠上下文,z-index:auto不会创建。但它们的堆叠重量是相同的
