SVG 使用 defs 在 chrome 46 上不起作用答案

【问题标题】：SVG use defs not work on chrome 46SVG 使用 defs 在 chrome 46 上不起作用
【发布时间】：2017-12-27 04:13:41
【问题描述】：

我的 SVG 中的 use 标签适用于 Chrome 最新版本（58、59，可能是 50+），但不适用于 Chrome 46（可能是 40+）。为什么？

<svg>
  <defs>
    <g id="diamond" viewBox="0 0 120 60" enable-background="new 0 0 120 60">
            <path d="M 11 -24 L 44 -6 Q 55 0 44 6
                    L 11 24 Q 0 30 -11 24
                    L -44 6 Q -55 0 -44 -6
                    L -11 -24 Q 0 -30 11 -24" fill="#FFFFFF" stroke="#CCCCCC" stroke-width="2px" stroke-miterlimit="10"></path>
        </g>
  </defs>
  <g>
    <use href="#diamond" transform="translate(60,30)" class="diamond" style="opacity: 1;"></use>
    
  </g>
</svg>

【问题讨论】：

绝对...谢谢先生。

标签： google-chrome svg

【解决方案1】：

编写 href 而不是 xlink:href 的能力是相当新的。它是 SVG 2 规范的一部分。 SVG 1.1 规范只定义了 xlink:href。

如果您需要针对旧浏览器或 Safari，则需要同时使用 xlink:href 或代替 href。

【讨论】：