示例
html
<svg viewBox="0 0 420 200" xmlns="http://www.w3.org/2000/svg">
<filter id="emboss1" x="0" y="0" width="100%" height="100%">
<feTurbulence baseFrequency="0.025" seed="0" />
<feConvolveMatrix kernelMatrix="3 0 0 -4" order="2" />
</filter>
<filter id="emboss2" x="0" y="0" width="100%" height="100%">
<feTurbulence baseFrequency="0.025" seed="0" />
<feConvolveMatrix kernelMatrix="3 0 0 0 0 0 0 0 -4" order="3" />
</filter>
<rect x="0" y="0" width="200" height="200" filter="url(#emboss1)" />
<rect x="220" y="0" width="200" height="200" filter="url(#emboss2)" />
</svg>
用法说明
值 |
<number-optional-number>
|
---|---|
默认值 | 3 |
可动画的 | 是 |
<number-optional-number>
-
此值指示卷积核矩阵每个维度的单元数。提供的值必须是大于零的
<integer>
。非整数值将被截断,即四舍五入到最接近零的整数值。第一个数字表示矩阵的列数。第二个数字表示矩阵的行数。如果未提供第二个数字,则默认为第一个数字。建议仅使用较小的值(例如 3);较高的值可能会导致 CPU 开销非常大,并且通常不会产生能够证明对性能影响合理的结果。
规范
规范 |
---|
滤镜效果模块第 1 级 # element-attrdef-order |
浏览器兼容性
加载中…