Question

我需要在HTML文档中嵌入SVG文件。 File Example.svg与HTMl文件位于同一目录中。

使用以下代码，没有插入SVG并且没有显示，但是在Chrome DEV工具中查看网络首次亮相面板我可以看到SVG已加载。

可能有什么问题以及如何解决？

<!DOCTYPE html>
    <html>
    <head>
        <title></title>
        <meta charset="utf-8" />
    </head>
    <body>
        <svg width="250" height="250">
            <use xlink:href="Example.svg"></use>
        </svg>
    </body>
</html>

我的SVG文件的内容https://jsfiddle.net/900xLbor/

此处的问题相同：https://jsfiddle.net/900xLbor/2/

Answer 1

MDN article about xlink:href attribute on the <use> element：

对SVG文档中的元素/片段的<IRI>引用。

换句话说，您需要将要使用的元素的id设置为href：
<use xlink:href="Example.svg#svg2"/>

Here is a plunker demonstration

无法使用xlink：href嵌入SVG文件

1 个答案: