Page 132 - css揭秘
P. 132
图 4-18
伪元素现在正覆盖在文本之上
图 4-19
使用 z-index: -1; 来把伪元素移
动到宿主元素的后面
现在该把半透明红色背景换掉了，换成跟背层完全匹配的背景。要实现
这一点，我们要么把 <body> 的背景复制过来，要么把伪元素的背景声明合
1 ①
并过去。我们现在可以进行模糊处理吗？来试试看 ：
body, main::before {
background: url("tiger.jpg") 0 / cover fixed;
}
main {
position: relative;
background: hsla(0,0%,100%,.3);
}
① 为什么不对 main::before 使用 background: inherit 呢？因为伪元素会从 main（而不是
body）那里继承样式，这样它只能得到一个半透明的白色背景。
18 毛玻璃效果 101
ࠡ JOEC
