使用SVG滤镜来创建大小一致的阴影。具体实现方法如下：
首先，我们需要创建一个SVG滤镜来产生阴影效果。可以使用SVG的<filter>元素来定义滤镜。
<filter id="dropshadow" height="130%">
<feGaussianBlur in="SourceAlpha" stdDeviation="3"/>
<feOffset dx="2" dy="2" result="offsetblur"/>
<feComponentTransfer>
<feFuncA type="linear" slope="0.4"/>
</feComponentTransfer>
<feMerge>
<feMergeNode/>
<feMergeNode in="SourceGraphic"/>
</feMerge>
</filter>
将创建的滤镜
应用
到SVG路径中。可以使用<path>元素的filter属性来
应用
。
<path d="M50 10 L100 100 L 0 100 z" fill="#8C8C8C" filter="url(#dropshadow)" />
现在，我们需要确保阴影大小与路径大小一致。为此，我们可以使用<mask>元素将该标记裁剪成指定大小的大小。
<mask id="clip">
<path d="M50 10 L100 100 L 0 100 z" fill="#FFFFFF" />
</mask>
最后，将创建的<mask>元素
应用
到路径中。可以使用<path>元素的mask属性来
应用
。
<path d="M50 10 L100 100 L 0 100 z" fill="#8C8C8C" filter="url(#dropshadow)" mask="url(#clip)" />
这样，无论缩放尺寸如何，阴影大小都将保持一致。
