Edge旧内核SVG滤镜使用教程

本文深入剖析了Edge旧内核（Edge 12–18，基于EdgeHTML）在SVG滤镜支持上的关键限制与实战解决方案：它完全不支持通过CSS的`filter: url()`引用外部SVG文件中的滤镜定义，无论路径、MIME类型或服务器配置如何正确，根源在于内核级设计——仅认**同文档内联的``或`background-image`引入——不用于滤镜绑定，仅作展示。这是一份面向兼容性攻坚的硬核指南，帮你绕过Edge旧内核的“滤镜黑洞”，让模糊、阴影等效果在老旧环境中稳定落地。

Edge旧内核不支持url(#filter-id)引用外部SVG滤镜

Edge（EdgeHTML内核，即Edge 12–18）对CSS中通过url()引用外部SVG文档里的支持极差——哪怕路径正确、MIME无误，滤镜也大概率不生效。这不是缓存或路径问题，是内核级限制：它只认**同文档内联的**，对外部文件中的定义视而不见。

实操建议：

• 把外部SVG里的内容（含）完整复制进当前HTML的标签内（可隐藏：style="position: absolute; width: 0; height: 0"）
• 确保id唯一，且CSS中引用写成filter: url(#my-blur)（注意是#，不是./filters.svg#my-blur）
• 避免用