设置伪元素的层级低于父元素层级

一般情况下，默认伪元素::after的层级在::before之上，并且伪元素的层级高于父元素。

1. 使用3d转换。

通过设置transform-style:preserve-3d;和transform:translateZ(-1px);，可以保证伪元素的层级只在父元素之下，而不在其他父辈的父辈之下。

2.设置伪元素的z-index = -1。

::before{

z-index:-1;

}