我创建了一个带有内联 SVG 的 XHTML 文件。当测试为 .XHTML 时，它不会显示，但当测试为 HTML 时，它会显示。我已经搜索过互联网并相信我已经指定了正确的 namespace 等，但是，我很困惑为什么它没有显示。请帮助我理解我做错了什么。
注意:我也尝试过使用或不使用 xlink，但没有看到任何变化(但是我需要 xlink，因为我需要 safari 支持)。
预先感谢您的帮助!
示例:index.xhtml
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:svg="http-www.w3.org/2000/svg" xmlns:xlink="http-www.w3.org/1999/xlink">
<head>
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=utf-8" />
<title>inline svg in XHTML file</title>
</head>
<body>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px">
<defs>
<symbol id="icon-home" viewBox="0 0 32 32"><title>Home Icon</title>
<path d="M32,19.271L16,5.582L0,19.271v-5.582L16,0l16,13.689V19.271z M28,18.773V32h-8v-8.817h-8V32H4V18.773l12-9.919L28,18.773z" />
</symbol>
</defs>
</svg>
<div>
<a href="#"><svg style="width:32px; height:32px;" viewBox="0 0 32 32"><use xlink:href="#icon-home" /></svg> home</a>
</div>
</body>
</html>最佳答案
使用xmlns最底部的属性<svg>也一样，然后就可以了。
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:svg="http-www.w3.org/2000/svg" xmlns:xlink="http-www.w3.org/1999/xlink">
<head>
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=utf-8" />
<title>inline svg in XHTML file</title>
</head>
<body>
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" height="0">
<defs>
<symbol id="icon-home" viewBox="0 0 32 32"><title>Home Icon</title>
<path d="M32,19.271L16,5.582L0,19.271v-5.582L16,0l16,13.689V19.271z M28,18.773V32h-8v-8.817h-8V32H4V18.773l12-9.919L28,18.773z" />
</symbol>
</defs>
</svg>
<div>
<a href="#"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="width:32px; height:32px;" viewBox="0 0 32 32"><use xlink:href="#icon-home" /></svg> home</a>
</div>
</body>
</html>顺便说一下，如<svg>在 XHTML 中，自 XHTML5 以来才定义，使用 XHTML 1.0 文档类型将无法验证(即使它可以在适当的命名空间下完美运行)。解决方案是将文档类型更改为 XHTML5。
关于svg - 内联 svg 不显示在 xhtml 中，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/54917411/