Css 来自不同svg文件的引用过滤器

如何引用在不同文件中定义的过滤器？例如，在文件夹

assets

中有一个

filter.svg

，它具有：

<svg xmlns="http://www.w3.org/2000/svg">
  <defs>
    <linearGradient id="gradient">
      <stop offset="20%" stop-color="#39F" />
      <stop offset="90%" stop-color="#F3F" />
    </linearGradient>
  </defs>
</svg>

---

现在在另一个文件中，我在另一个

svg

元素中绘制了一些形状。如何应用此渐变过滤器？简单地说：

fill=“url（assets/filter.svg#gradient）”

？因为它看起来没有选择定义。

如注释所示，Chrome（仍然！）不支持引用外部文件中定义的过滤器、填充、笔划、剪辑路径、遮罩或标记，如Chrome v45

查看哪个似乎正在跟踪此问题

---

在这方面似乎也存在一些问题，所以尽管我自己没有测试过，但我认为其他基于webkit的浏览器也可能有这个限制。

这是在chrome中，对吗？请更具体地说明您将来会在哪里看到这个问题：）它在Opera（Presto）和Firefox中应该可以正常工作，请参见示例。@ErikDahlström非常感谢您的示例。我还不知道xlink。不幸的是，这只适用于我的Firefox（如您所述）。不在Chrome 31中，bummer：(