解决伪元素覆盖子元素问题 | Jake Ma

解决伪元素覆盖子元素问题

使用伪元素的时候，有时需要和父元素重合使用，此时伪元素会始终比父元素层级高，会显示在父元素上面。当我们想把伪元素放在下面，可以使用两种方法

z-index

设置z-index

3D排列

有时候z-index方法不太合适，可以使用3d的方法来显示

 .title {
    position: relative;
    transform-style: preserve-3d;
}

.title::after {
    content: '';
    position: absolute;
    top: 0.13rem;
    left: 0;
    width: 0.67rem;
    height: 0.06rem;
    transform: translateZ(-1px);  
}