css堆叠上下文

定义: 堆叠上下文,它是一块区域,这块区域由某个元素创建,它规定了该区域中的内容在z轴上排列的先后顺序

创建堆叠上下文的元素

  1. HTML元素(根元素)

  2. 设置了z-index(非auto值,为auto就是没有创建)数值的 定位元素

同一个堆叠上下文中的元素在z轴上的排列

  1. 从后到前的排列顺序(靠近用户):
    (1)创建堆叠上下文的元素的背景和边框 (html的背景和边框是排列在最后的)

    (2)堆叠级别(z-index, stack level)为负值的堆叠上下文  
​
    (3)常规流非定位的块盒

    (4)非定位的浮动盒子

    (5)常规流非定位行盒

    (6)任何 z-index 是 auto的定位子元素,以及 z-index 是 0 的堆叠上下文

    (7)堆叠级别为正值的堆叠上下文
发布了47 篇原创文章 · 获赞 12 · 访问量 533
展开阅读全文

没有更多推荐了,返回首页

©️2019 CSDN 皮肤主题: 1024 设计师: 上身试试

分享到微信朋友圈

×

扫一扫,手机浏览