Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/git/21.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Css 相对定位元素的默认z索引是什么?_Css - Fatal编程技术网

Css 相对定位元素的默认z索引是什么?

Css 相对定位元素的默认z索引是什么?,css,Css,下午好 我已经做了一个非常简单的页面,展示了我们可以在css中为我们公司的新员工使用的不同职位类型,这相当尴尬地暴露了我个人知识的差距 我已经在页面上定位了所有元素,但我注意到当页面滚动时,我的相对定位元素将位于我的粘滞元素的顶部。这几乎就像它有一个z-index,它比我的粘滞元素高——不过我没有设置任何z-index值 给定我提供的代码,这是正确的行为吗?抱歉,如果这真的很简单,我会坐在这里挠头 正文{ 字体大小:20px; 字体系列:Arial、Helvetica、无衬线字体; 高度:3

下午好

我已经做了一个非常简单的页面,展示了我们可以在
css
中为我们公司的新员工使用的不同职位类型,这相当尴尬地暴露了我个人知识的差距

我已经在页面上定位了所有元素,但我注意到当页面滚动时,我的相对定位元素将位于我的粘滞元素的顶部。这几乎就像它有一个
z-index
,它比我的粘滞元素高——不过我没有设置任何
z-index

给定我提供的代码,这是正确的行为吗?抱歉,如果这真的很简单,我会坐在这里挠头

正文{
字体大小:20px;
字体系列:Arial、Helvetica、无衬线字体;
高度:3000px;
}
.亲戚{
宽度:20%;
最小高度:200px;
背景色:淡蓝色;
颜色:白色;
填充:10px;
位置:相对位置;
}
.粘的{
位置:粘性;
背景颜色:绿色;
颜色:白色;
填充:10px;
宽度:20%;
高度:200px;
排名:0;
}
.固定{
位置:固定;
填充:10px;
背景色:浅绿色;
颜色:黑色;
高度:200px;
宽度:20%;
右:200px;
顶部:300px;
}
.绝对的{
位置:绝对位置;
填充:10px;
右:0;
排名:0;
宽度:20%;
高度:200px;
背景色:红色;
颜色:白色;
}
.静态{
位置:静态;
宽度:20%;
背景色:蓝紫色;
填充:10px;
颜色:白色;
高度:200px;
}

这是个棘手的问题
这是一个相对的div
这是一个绝对的div
这是一个普通的div
这是一个固定的div

如果两个元素位于相同的堆叠上下文中(具有相同的
z-index
值),那么浏览器将只查看它们插入dom的顺序:最后一个元素将显示在前一个元素的顶部。

以下是有关此主题的更多信息:

如果两个元素位于相同的堆叠上下文中(具有相同的
z-index
值),那么浏览器将只查看它们插入dom的顺序:最后一个元素将显示在前一个元素的顶部。

以下是有关此主题的更多信息:

是的,这是正常行为。相对定位的元素显示在源中的粘滞定位元素之后,因此其自然堆栈级别更高,因此它显示在粘滞定位的元素之上。看,或者


粘性定位的元素与相对和绝对定位的元素遵循相同的堆叠规则。

是的,这是正常行为。相对定位的元素显示在源中的粘滞定位元素之后,因此其自然堆栈级别更高,因此它显示在粘滞定位的元素之上。看,或者

粘性定位的图元与相对和绝对定位的图元遵循相同的堆叠规则

当不涉及z索引和位置属性时,规则 非常简单:基本上,堆叠顺序与 HTML中的出现顺序。(好的,实际上要多一点 比这复杂,但只要你不使用负片 如果边距与内联元素重叠,您可能不会遇到 边缘情况。)


将position属性引入混合时,任何 元素(及其子元素)显示在任何 非定位元素。(表示元素已“定位”意味着 它具有静态以外的位置值,例如相对、绝对、, )

Z索引仅适用于使用
绝对
相对
固定
定位的元素。由于您的粘滞元素在HTML中显示在静态元素之前,因此它将优先于堆叠顺序

当不涉及z索引和位置属性时,规则 非常简单:基本上,堆叠顺序与 HTML中的出现顺序。(好的,实际上要多一点 比这复杂,但只要你不使用负片 如果边距与内联元素重叠,您可能不会遇到 边缘情况。)


将position属性引入混合时,任何 元素(及其子元素)显示在任何 非定位元素。(表示元素已“定位”意味着 它具有静态以外的位置值,例如相对、绝对、, )


Z索引仅适用于使用
绝对
相对
固定
定位的元素。由于您的粘滞元素在HTML中显示在静态元素之前,因此它将优先于堆叠顺序。

您可以使用z-index:-1;在粘性容器上。我不太清楚它为什么会这样想是的,我知道我该如何去修复它-更好奇的是它为什么会这样。你可以使用z-index来修复它:-1;在粘性容器上。我不太清楚它为什么会这样想是的,我知道我该如何去修复它-更好奇的是它为什么会这样。谢谢你的解释,这是有道理的!谢谢你的解释,这很有道理!谢谢你的帮助!谢谢你的帮助!