标准差
示例
html
<svg viewBox="0 0 480 200" xmlns="http://www.w3.org/2000/svg">
<filter id="gaussianBlur1">
<feGaussianBlur stdDeviation="1" />
</filter>
<filter id="gaussianBlur2">
<feGaussianBlur stdDeviation="5" />
</filter>
<filter id="gaussianBlur3" x="-30%" y="-30%" width="160%" height="160%">
<feGaussianBlur stdDeviation="10" />
</filter>
<circle cx="100" cy="100" r="50" style="filter: url(#gaussianBlur1);" />
<circle
cx="100"
cy="100"
r="50"
style="filter: url(#gaussianBlur2); transform: translateX(140px);" />
<circle
cx="100"
cy="100"
r="50"
style="filter: url(#gaussianBlur3); transform: translateX(280px);" />
</svg>
使用说明
值 | <number-optional-number> |
---|---|
默认值 | 0 |
可动画 | 是 |
<number-optional-number>
-
如果提供两个数字,则第一个数字代表沿 x 轴的标准差值。第二个值代表沿 y 轴的标准差。如果提供一个数字,则该值用于 X 和 Y。
不允许负值。值为零将禁用给定滤镜基本元素的效果(即,结果是滤镜输入图像)。如果
stdDeviation
在 X 或 Y 中仅为 0,则效果是仅在具有非零值的方向上应用模糊。
规范
规范 |
---|
滤镜效果模块级别 1 # element-attrdef-fegaussianblur-stddeviation |
浏览器兼容性
BCD 表仅在启用 JavaScript 的浏览器中加载。