-webkit-filter
- webkit：CSS
- 分类：视觉
说明：
CSS滤镜属性，可以在元素呈现之前，为元素的渲染提供一些效果，如模糊、颜色转移之类的。滤镜常用于调整图像、背景、边框的渲染。
- CSS标准里包含了一些已实现预设效果的函数。你也可以将设定了滤镜效果的SVG文件，通过URL属性引用给SVG滤镜元素（ SVG filter element）.
语法：
-webkit-filter:none | blur(
默认值：none
取值：
| none | 无SVG滤镜效果。 |
|---|---|
| blur(<number>px) | 设置对象的模糊效果。 |
| brightness(<percentage>) | 设置对象的亮度。除了百分比外，也可以用非负数表达。 |
| contrast(<percentage>) | 设置对象的对比度。除了百分比外，也可以用0-1的数字表达。 |
| grayscale(<percentage>) | 设置对象的灰度。除了百分比外，也可以用0-1的数字表达。 |
| hue-rotate(<number>deg) | 设置对象的色相旋转。用0-360数字表达。 |
| invert(<percentage>) | 设置对象的反色。除了百分比外，也可以用0-1的数字表达。 |
| opacity(<percentage>) | 设置对象的透明度。除了百分比外，也可以用0-1的数字表达。 |
| saturate(<percentage>) | 设置对象的饱和度。除了百分比外，也可以用非负数表达。 |
| sepia(<percentage>) | 设置对象的褐色程度。除了百分比外，也可以用0-1的数字表达。 |
| drop-shadow(<length①> <length②> radius <color>) | 设置对象的阴影。第一个长度是向右偏移距离，第二个长度是向下偏移距离，皆可为负值，皆为必传参数；第三个是阴影圆角，可选；第四个是阴影颜色，可选。 |
| url(path.svg#a) | 设置对象滤镜效果。通过SVG可实现以上所有效果。SVG可写在页面里，也可外部引用。可增加锚节点。 |