SVG(可缩放矢量图形)提供了一种在图形上应用滤镜效果的方式。以下是一个简单的SVG滤镜的例子:
<svg width="200" height="200" xmlns="http://www.w3.org/2000/svg">
  <defs>
    <!-- 定义一个模糊滤镜 -->
    <filter id="blurFilter" x="0" y="0" width="100%" height="100%">
      <feGaussianBlur in="SourceGraphic" stdDeviation="5" />
    </filter>
  </defs>
  
  <!-- 应用滤镜到一个矩形 -->
  <rect width="100" height="100" fill="blue" filter="url(#blurFilter)" />
</svg>

在上面的例子中,我们创建了一个模糊滤镜,并将其命名为“blurFilter”。然后,我们在一个蓝色的矩形上应用这个滤镜。这个滤镜使用了高斯模糊(feGaussianBlur)来模糊图形,其标准偏差为5。

你可以根据需要调整滤镜效果的参数,也可以尝试其他类型的滤镜效果,如颜色矩阵、阴影等。这只是一个简单的例子,你可以根据具体需求进行更复杂的滤镜设置。


转载请注明出处:http://www.pingtaimeng.com/article/detail/14677/SVG