SVG 滤镜

SVG 滤镜

SVG 滤镜用来增加对SVG图形的特殊效果。


浏览器支持

表中的数字指定了支持SVG滤镜的第一个浏览器版本。

 
SVG Filters 8.0 10.0 3.0 6.0 9.6

SVG 滤镜

在本教程中,我们将仅展示一个可能采用的特殊效果。基础知识展示后,你已经学会使用特殊效果,你应该能够适用于其他地方。这里的关键是给你一个怎样做SVG的想法,而不是重复整个规范。

SVG可用的滤镜是:

  • <feBlend> - 与图像相结合的滤镜
  • <feColorMatrix> - 用于彩色滤光片转换
  • <feComponentTransfer>
  • <feComposite>
  • <feConvolveMatrix>
  • <feDiffuseLighting>
  • <feDisplacementMap>
  • <feFlood>
  • <feGaussianBlur>
  • <feImage>
  • <feMerge>
  • <feMorphology>
  • <feOffset> - 过滤阴影
  • <feSpecularLighting>
  • <feTile>
  • <feTurbulence>
  • <feDistantLight> - 用于照明过滤
  • <fePointLight> - 用于照明过滤
  • <feSpotLight> - 用于照明过滤

提示: 除此之外,您可以在每个 SVG 元素上使用多个滤镜!