關於僞元素::before&::after的z-index問題研究。待續...

代碼：

<div id="test"></div>

/*狀況1：#test不使用z-index*/
#test{width:120px;height: 60px;background:#bcbcbc;position: absolute; left: 200px;/*z-index:0;*/}

/*狀況2：#test使用固定定位*/
#test{width:120px;height: 60px;background:#bcbcbc;position: fixed; left: 200px;/*z-index:0;*/}

/*狀況3：#test使用z-index*/
#test{width:120px;height: 60px;background:#bcbcbc;position: absolute; left: 200px;z-index:0;}

#test::before{ content:''; display: block; width:60px;height: 60px;background: #333; position: absolute; left:-20px; top:5px; z-index: -1; } #test::after{ content:''; display: block; width:60px;height: 60px;background: #333; position: absolute; right:-20px; top:5px; z-index: -1; }

效果圖：

狀況1效果

狀況2和狀況3的效果同樣

那麼，問題來了：

1.爲何僞元素的父元素使用z-index以後，僞元素的z-index失效.

2.爲何僞元素的父元素使用fixed以後，即便不使用z-index,僞元素的z-index失效.

3.官方文檔也沒有介紹這一塊空缺.