-
7阶层叠水平
查看全部 -
内容是页面最重要的实体，因此，层叠水平要搞
查看全部 -
z-index与其他Css属性层叠上下文
查看全部 -
其他CSS属性与层叠上下文
1、z-index不为auto且父元素display：flex|inline-flex
2、元素的opacity值不为1
3、元素的transform不为none
4、position：fixed声明
5、元素的filter值不为none
……
查看全部 -
z-index与层叠上下文
1、定位元素默认z-index：auto；可以看成是z-index：0；
2、z-index不为auto的定位元素会创建层叠上下文
3、z-index层叠顺序的比较止步于父级层叠上下文
4、一旦容器z-index值为数值，图片的层叠上下文元素变为容器
5、从层叠顺序上讲，z-index:auto可以看成z-index:0，但是从层叠上下文来讲，两者存在本质差异
6、z-index受限于层叠上下文
查看全部 -
元素的层叠顺序：
层叠顺序表示元素发生层叠时的特定的垂直显示顺序
查看全部 -
CSS3中的层叠上下文和层叠水平：
1、层叠上下文：表示元素在z轴上有“可以高人一等”
（可以理解为普通老百姓HTML元素，当官了，离皇帝越近了）
具有层叠上下文的元素：
1）根元素，成为“跟层叠上下文（皇亲国戚）
2）z-index值为数值的定位元素（科考入选）
3）其他属性（其他途径）
2、层叠水平：层叠上下文的每个元素都有一个层叠水平，决定了同一个层叠上下文中元素在z轴上的显示顺序，遵循“后来居上”和“谁大谁上”的层叠准则
层叠水平不是z-index，普通元素也有层叠水平（官员家里的仆人也有一个排列顺序，表示谁离官员更近）
查看全部 -
z-index与CSS定位属性：
1、定位元素只有设置为relative、absolute、fixed、sticky才有用
2、若定位元素z-index没有嵌套
1）后来居上：不设置其它属性时，通常后面的元素覆盖前面的
2）哪个大，哪个上，z-index大的覆盖小的
3、若定位元素发生嵌套
祖先优先原则：前提是z-index设置为确定的数值，此时需要比较祖先元素z-index的大小来确定哪个元素在上面
查看全部 -
z-index：
1、属性值
z-index：auto（默认，相当于为0）/ 整数值 /inherit（继承）;
2、z-index基本特性
1）支持负值
2）支持css3的animation动画
3）在css2.1时代，要与定位元素配合使用
查看全部 -
如果都是数字，发生嵌套，祖先优先，但祖先是auto就没用了。
查看全部 -
z-index只对定位元素起作用
查看全部 -
更完整的7阶层叠上下文
查看全部 -
其他参与层叠上下文的属性们
查看全部 -
7阶层叠水平
查看全部 -
z-index
查看全部
举报