关于z-index的问题

关于z-index的问题


求解,为什么label:befor中的z-index一定要设置成负值才有效? 为何 父元素label的z-index设置比before的值高,但before却不能设置成正值


如:.picture_bar  label{width:150px;
                    height:30px;
                    color:#fff;
                    text-align: center;
                    line-height: 30px;
                    font-size: 20px;
                    margin-top:350px;
                    float: left;
                    position: relative;
                    z-index: 2;
                    }                    
.picture_bar  label:before{content: "";
                            width:35px;
                            height:35px;
                            border-radius: 50%;
                            background: rgba(130,195,217,0.9);
                            position: absolute;
                            z-index: 1;
                            left: 50%;                            
                            margin-left:-16px;
                            }

父元素层次大于子元素排在前面,为何这样不能实现,必须负值才行?

正在回答

登陆购买课程后可参与讨论,去登陆

1回答

举个例子,首先代码在浏览器显示是<label>

                                                           :before

                                                               1

                                                     </label>

首先对于 before的位置 在1的前面,所以before的值会盖住1,

其次 label 没设置z-index的值,所以1的z-index 默认为0

最后把before的z-index的值为-1,before就会在1位置的后面。

问题已解决,确定采纳
还有疑问,暂不采纳

恭喜解决一个难题,获得1积分~

来为老师/同学的回答评分吧

0 星
请稍等 ...
意见反馈 帮助中心 APP下载
官方微信

在线咨询

领取优惠

免费试听

领取大纲

扫描二维码,添加
你的专属老师