Question

我最近创建了一个svg元素，它在本地使用自闭项标签，如下所示：

<svg xmlns="http://www.w3.org/2000/svg" version="1.1" style="height: 25px; width: 300px; display: inline-block;">
  <circle cx="10" cy="10" r="4" stroke="black" stroke-width="1" fill="none" />
  <line x1="14" y1="10" x2="286" y2="10" stroke-width="2" stroke="black" />
  <circle cx="290" cy="10" r="4" stroke="black" stroke-width="1" fill="none" />
</svg>

但是当在生产服务器上呈现时，它出现了所有嵌套的东西。第一个圆圈正确嵌套在svg元素中，但该行嵌套在第一个圆圈内，第二个圆圈嵌套在该行内。结束标记行的结尾类似于：</circle></line></circle></svg>

我必须更改svg元素以使用结束标记，如下所示：

<svg xmlns="http://www.w3.org/2000/svg" version="1.1" style="height: 25px; width: 300px; display: inline-block;">
  <circle cx="10" cy="10" r="4" stroke="black" stroke-width="1" fill="none" ></circle>
  <line x1="14" y1="10" x2="286" y2="10" stroke-width="2" stroke="black" ></line>
  <circle cx="290" cy="10" r="4" stroke="black" stroke-width="1" fill="none" ></circle>
</svg>

无处不在，我认为svg元素上的结束标记是可选的。是什么给了什么？

Answer 1

您的初始标记没有任何问题（正如您所见：http://jsfiddle.net/6b0fv1a2/），因此这让我相信它是您服务器的mime类型。

的Apache：＆＃34;虽然SVG MIME类型默认包含在自1.3.x版以来Apache Web服务器支持的MIME类型列表中，但旧版本可能需要更新。＆＃34;

的.htaccess

设置正确MIME类型的最简单方法可能是使用＆＃34; .htaccess＆＃34;文件。这是一个经常隐藏的配置文件。如果您的服务器没有这样的文件，请创建一个文件并将其命名为＆＃34; .htaccess＆＃34;，并将SVG文件扩展名与正确的MIME类型相关联;如果文件已存在，您只需向其添加正确的条目即可。您应添加的特定行是：

AddType image/svg+xml svg
AddType image/svg+xml svgz

阅读更多（和其他服务器）：http://www.w3.org/services/svg-server/

自我关闭svg元素

1 个答案: