Description
花絮与注解
第 102 页 · 最后一段
为了补偿这种情况，我们需要让伪元素相对其宿主元素的尺寸再向外扩大至少
20px（即它的模糊半径），我们可以通过-20px的外边距来达到目的，由于不同浏览器的模糊算法可能存在差异，用一个更大的绝对值（比如-30px）会更保险一些……
书中采用 margin: -30px 来实现伪元素向外扩张的效果。当然我们也可以换用另一种方法，把 top、left、right、bottom 的值都设置为 -30px，效果是一样的。
但显然还是用 margin 比较优雅，它的简写语法一个顶四个，改起来也方便。
第 101 页 ‧ 代码块
body, main::before { background: url("tiger.jpg") 0 / cover fixed; }
注意这里 background 的值。其中：
-
cover是background-size的值。它会自动拉伸背景图像，确保背景图像刚好覆盖整个 “容器”。 -
fixed是background-attachment的值。它在这里的作用是让背景图像对齐到整个视口，也就是把整个视口（而不是元素自身）作为背景图像显示的 “容器”。
这两个属性同时作用，就可以让伪元素（main::before）显示出的背景图像正好等于大背景（body）的中间那一部分，做到书中所述的 “无缝匹配”。
第 99 页 ‧ 最后一段
借助
blur()滤镜，我们在 CSS 中获得了对元素进行模糊处理的能力……
书中实现毛玻璃效果的手法相当繁琐，因为在写书时，CSS 只有 filter: blur() 滤镜可用。
在翻译本书时，Safari 9（iOS 9）已经率先支持了 backdrop-filter 属性。这个属性直接对元素的背层应用滤镜，可以轻而易举地实现本节的毛玻璃效果。
需要注意的是，backdrop-filter 属性仅处于 ED 阶段，在 Safari 中还需要加前缀使用。不过也别担心，由于这个属性是刚性需求，我认为它被标准化只是时间问题。如果你的项目需要它来实现一些锦上添化的效果，不妨大胆用吧！