这不是一个错误。 Safari 会因为过滤器声明中的错误语法而惩罚您:
<filter id="filter" y="-100" x="-100" height="300" width="300">
根据规范,这应解读为 height="30000%" 和 width="30000%"。 Safari 说“好吧,我猜你是这个意思”并自动调整过滤器分辨率,这样它就不会为这个非常大的缓冲区分配大量内存 - >因此分辨率很差。
如果您的意思是 300% - 那么您需要输入 300%。这是一个修复:
<filter id="filter" y="-100%" x="-100%" height="300%" width="300%">
如果您的意思是 300px(真正的用户空间单位) - 那么这是另一个修复:
<filter id="filter" y="100" x="-100" height="300" width="300" filterUnits="userSpaceOnUse">
您必须通过指定 userSpaceOnUse 明确告诉 Safari 您指的是像素(否则它将使用静默默认 objectBoundingBox)
另一个修复方法是通过显式指定 filterRes 来覆盖 Safari 的过滤器分辨率调整。 filterRes 在新的 Filters 1.0 规范中已被弃用,并且已从最新的 Chrome 和 Firefox 中删除,但 Safari 仍然支持它。由于这会导致大量内存占用(并且很难相信您打算像您那样调整过滤器的大小) - 不建议这样做。但无论如何 - 为了完整性。
<filter id="filter" y="-100" x="-100" height="300" width="300" filterRes="100000">
(另外两个小注意事项 - 您可以通过使用自关闭元素使过滤器变得不那么冗长。并且您所做的模糊调整不会减轻模糊,它只是调高不透明度。)