博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
你不知道的z-index
阅读量:6333 次
发布时间:2019-06-22

本文共 500 字,大约阅读时间需要 1 分钟。

关于z-inde 

 w3c描述 (z-index )

每个元素都具有三维空间位置,除了水平和垂直位置外,还能在 “Z轴” 上层层相叠、排列。元素在 “Z轴” 方向上的呈现顺序,由层叠上下文和层叠级别决定。

在文档中,每个元素仅属于一个层叠上下文。元素的层叠级别为整型,它描述了在相同层叠上下文中元素在 “Z轴” 上的呈现顺序。

同一层叠上下文中,层叠级别大的显示在上,层叠级别小的显示在下,相同层叠级别时,遵循后来居上的原则,即其在HTML文档中的顺序。

不同层叠上下文中,元素呈现顺序以父级层叠上下文的层叠级别来决定呈现的先后顺序,与自身的层叠级别无关

理解: 

  层叠上下文可理解为一摞书的每一本书,层叠级别为每一本书的每一页,越上面越容易被看到 
注意

    • z-index为层叠级别。 只有设置定位(static除外)才可以设置z-index
    • postion:fixed会创建新的层叠上下文
    • opacity小于1时,会创建新的层叠上下文
    • 同处一个层叠上下文,且为设置层叠级别时,遵从‘后来居上’原则

转载于:https://www.cnblogs.com/sunweinan/p/z-index.html

你可能感兴趣的文章
IP_VFR-4-FRAG_TABLE_OVERFLOW【cisco设备报错】碎片***
查看>>
Codeforces Round #256 (Div. 2) D. Multiplication Table 【二分】
查看>>
ARM汇编指令格式
查看>>
HDU-2044-一只小蜜蜂
查看>>
HDU-1394-Minimum Inversion Number
查看>>
df -h 卡住
查看>>
第七天1
查看>>
[转] createObjectURL方法 实现本地图片预览
查看>>
JavaScript—DOM编程核心.
查看>>
JavaScript碎片
查看>>
Bootstrap-下拉菜单
查看>>
soapUi 接口测试
查看>>
【c学习-12】
查看>>
工作中MySql的了解到的小技巧
查看>>
loadrunner-2-12日志解析
查看>>
2013年蓝桥杯省赛C/C++A组真题解析
查看>>
C# Memcached缓存
查看>>
iOS开发NSLayoutConstraint代码自动布局
查看>>
正则表达式
查看>>
mysql [ERROR] Can't create IP socket: Permission denied
查看>>