我目前正在模糊图像，并在包含图像时将其用作背景。 我正在使用以下svg过滤器，并使用feGaussianBlur和feColorMatrix分两步进行过滤。这在Chrome浏览器中完美呈现，但在Safari和移动浏览器中，我看到了奇怪的伪像。

<svg xmlns="http://www.w3.org/2000/svg" version="1.1">
    <filter
      id="blurry"
      width="150%"
      height="150%"
      x="-25%"
      y="-25%"
      colorInterpolationFilters="sRGB"
    >
      <feGaussianBlur stdDeviation="45" />
      <feColorMatrix
        type="matrix"
        values="1 0 0 0 0  0 1 0 0 0  0 0 1 0 0 0 0 0 10 0"
      />
      <feGaussianBlur stdDeviation="45" />
      <feColorMatrix
        type="matrix"
        values="1 0 0 0 0  0 1 0 0 0  0 0 1 0 0 0 0 0 10 0"
      />
      <feComposite in2="SourceGraphic" operator="in" />
    </filter>
</svg>

然后在我的CSS中使用：

-webkit-filter: url('#blurry');
        filter: url('#blurry');

所需结果（在台式机上）：

我得到的结果：

它显示了这些怪异的差距。

我注意到的一些事情：

• 更改过滤器的尺寸和位置不起作用
• 在某些图像上我看不到这些伪像
• 更改过滤器stdDeviation无效

这与我的图像分辨率有关吗？