z-index

z-index特性——————设置元素的叠加顺序,但依赖于定位
仅仅在节点position为relative,absolute或fixed时生效
z-index值大的元素会覆盖在z-index值小的元素上

不含z-index的堆叠

  1. 不含定位属性的块元素出现在定位元素的下层
  2. 定位块元素按照他们在HTML结构中出现的顺序堆叠

层叠上下文
1.每一个网页都有一个默认的层叠上下文,这个层叠上下文的根源就是html元素
2.当你设置了定位元素和给一个元素赋予了除 auto外的z-index值时,你就创建了一个新的层叠上下文
3.一个层叠上下文的层叠次序
(1)背景和边框 形成层叠上下文的元素的背景和边框
(2)负z-index值 层叠上下文内有着负z-index值的子元素
(3)块级元素 文档流中非定位子元素
(4)浮动元素 非定位浮动元素
(5)行内 文档流中非定位子元素
(6)z-index:0 定位元素 这些元素形成新的层叠上下文
(7)正z-index值