这是一个使用’filter’属性将dropshadow应用于某些svg的示例。如果要控制阴影的不透明度,请查看此示例。该
slope属性控制赋予阴影的透明度。
示例中的相关位:
<filter id="dropshadow" height="130%"> <feGaussianBlur in="SourceAlpha" stdDeviation="3"/> <!-- stdDeviation is how much to blur --> <feOffset dx="2" dy="2" result="offsetblur"/> <!-- how much to offset --> <feComponentTransfer> <feFuncA type="linear" slope="0.5"/> <!-- slope is the opacity of the shadow --> </feComponentTransfer> <feMerge> <feMergeNode/> <!-- this contains the offset blurred image --> <feMergeNode in="SourceGraphic"/> <!-- this contains the element that the filter is applied to --> </feMerge></filter><circle r="10" />
Box-shadow被定义为可以在CSSbox上工作(阅读:矩形),而svg比矩形更具表现力。阅读SVG入门),进一步了解SVG过滤器的功能。



