Web浏览器无法显示SVG文件

Question

我有一个名为 graphics.svg 的文件，其中包含以下代码：

<?xml version="1.0" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg width="400" height="110">
  <rect width="400" height="110" style="fill:rgb(0,0,255);" />
</svg>

如果我从Web浏览器（Firefox、Chromium）打开该文件，向量图像将不会显示。相反，文件将以XML格式显示：

This XML file does not appear to have any style information associated with it. The document tree is shown below.

<svg width="400" height="110">
    <rect width="400" height="110" style="fill:rgb(0,0,255);"/>
</svg>

这是因为SVG文件应该嵌入到HTML文件中才能正常显示吗？

- Barun

Answer 1

不，这是因为您未能指定svg元素的名称空间。

xmlns="http://www.w3.org/2000/svg"

参见规范中的示例。

- Quentin

Answer 2

您缺少命名空间声明。

您需要将xmlns="http://www.w3.org/2000/svg"作为根<svg>元素的属性添加，同时您也可以添加xmlns:xlink="http://www.w3.org/1999/xlink"。

这里还有一些更完整的编写指南，您可能想要查看：这里。

- Robert Longson

---

为什么在文件中没有任何xlink内容时要设置xlink命名空间？ - Quentin

因为大多数SVG都包含xlink，一旦您添加需要它的内容，您就会再次遇到这个问题。 - Robert Longson