伪元素默认层级是在父元素之上的,同时 ::after在::before之上
伪元素方法1:z-index = -1
#parent{}
#parent::before{
/* 省略... */
z-index: -1
}
/* 此方法有一个问题,设置层级为负数,则该元素便位于最下层,
* 如若还要它在其他元素的上层则需要调整其他元素的层级,如果元素嵌套很多,
* 便需要设置一连串的z-index */
方法二: 3D转换
#parent{
/* */
transform-style: preserve-3d;
}
#parent::before{
/* 省略... */
transform: translateZ(-1px) // Z轴方向位移-1px
}
/* 此方法我测试过 位移的伪元素显示在了父元素之下,而且并不会显示在 爷爷辈的元素之下。 */