<defs> 和 <filter>
所有的SVG过滤器定义在一个 <defs>
元素中。<defs>
元素是definition的简写,用来包含特定元素的定义。
<filter> 元素用来定义一个SVG过滤器。<filter> 元素有一个必需的id属性用来唯一标识该过滤器。然后图形通过这个id来应用该过滤器。
SVG <feGaussianBlur>
实例代码
自己试试 »代码解释
- <filter> 标签的 id 属性可为滤镜定义一个唯一的名称(同一滤镜可被文档中的多个元素使用)
- filter:url 属性用来把元素链接到滤镜。当链接滤镜 id 时,和CSS id选择器语法类似,要使用 # 字符
- 滤镜效果是通过 <feGaussianBlur> 标签进行定义的。fe前缀是filter effects的缩写,可用于所有的滤镜
- <feGaussianBlur> 标签的 stdDeviation 属性可定义模糊的程度
- in="SourceGraphic" 表示效果应用于整个图形元素