为什么给label设置z-index没有效果呢？
老师是给label：before元素设置z-index：-1以实现效果，为什么我给label设置z-index:1不可以呢？
正在回答 回答被采纳积分+1
明白你的意思了，首先label 和label:before 属于父子元素的关系子，注意添加position属性及z-index的同级进行比较，即父元素需要和同级别的元素比较zindex，子元素在父元素中比较和自己同级别的zindex。但是想父与子发生层叠关系，注意以下：
当父元素设置了z-index: 数值，哪么子元素z-index和父元素的层叠无效（无论设置什么值都不起作用），但它的子元素的z-index进行层叠。
当父元素不设置z-index，或设置z-index: auto时，子元素的z-index：负值时，和父元素的层叠（父上子下），正值时和父元素的层叠无效（父下子上），如有多个子元素，根据z-index进行层叠。
希望对你有帮助，祝学习愉快，欢迎采纳。
.cr-container label{
font-style: italic;
width: 150px;
height: 34px;
cursor: pointer;
color: #fff;
font-size: 24px;
text-align: center;
line-height: 34px;
margin-top:350px;
float: left;
position: relative;
z-index: 1000;
}
.cr-container label:before{
content: '';
position: absolute;
width: 34px;
height: 34px;
border-radius: 50%;
background: rgba(130,195,217,.9);
left: 50%;
margin-left: -17px;
z-index: -1;
box-shadow: 0 0 0 4px rgba(255,255,255,.3);
}
就是如果去掉：before里面的z-index:-1， 即使label 里面的z-index设置为1000也没用，不知为什么
z-index 属性设置元素的堆叠顺序。拥有更高堆叠顺序的元素总是会处于堆叠顺序较低的元素的前面。
》层级关系的比较
1. 对于同级元素，默认(或position:static)情况下文档流后面的元素会覆盖前面的。
2. 对于同级元素，position不为static且z-index存在的情况下z-index大的元素会覆盖z-index小的元素，即z-index越大优先级越高。
3. 如果将 position 设为 relative (相对定位)，absolute (绝对定位) 或者 fixed (固定定位)，这样的节点会覆盖没有设置 position 属性或者属性值为 static 的节点
注意：尝试不用 position 属性, 但为节点加上 z-index 属性. 发现 z-index 对节点没起作用. z-index 属性仅在节点的 position 属性为 relative, absolute 或者 fixed 时生效.
所以根据这些规则，检查下你的代码有，希望对你有帮助，祝学习愉快，欢迎采纳。
- 参与学习 1887 人
- 提交作业 4643 份
- 解答问题 5760 个
有HTML和CSS基础，却不知道如何进阶？本路径带你通过系统学习，完成从“会做网页”到“做出好的动态网页”的蜕变，迈出成为前端工程师的第一步。
了解课程
恭喜解决一个难题，获得1积分~
来为老师/同学的回答评分吧
0 星