SVG 在 Mac Safari 中不起作用？答案

【问题标题】：SVG not working in Mac Safari?SVG 在 Mac Safari 中不起作用？
【发布时间】：2017-05-25 10:00:30
【问题描述】：

以下 SVG 图标适用于除 Mac Safari 之外的所有现代浏览器：

<symbol id="text" viewBox="0 0 39 43">
  <title>Add Text</title>
  <text transform="translate(-2 -14)" fill="#FFF" fill-rule="evenodd" font-size="64" font-family="TimesNewRomanPS-BoldMT, Times New Roman" font-weight="bold">
    <tspan x="0" y="57">T</tspan>
  </text>
</symbol>

此外，我以相同方式使用的所有其他图标在 Mac Safari 中都可以正常显示。

Mac Safari 不喜欢这个图标的原因是什么？

【问题讨论】：

找到最相似的工作图标，并一次将其更改为一个属性，直到它停止工作。那你就知道了。
究竟是什么不起作用？

标签： html css macos svg safari

【解决方案1】：

Mac Safari 的解决方案是在 <text> 上放置一个 CSS 类选择器并将所有样式移到那里。

使用 SVG 属性（如我原来的示例所示）将不起作用
将所有内容移入样式属性将不起作用。
注意：我没有测试每个单独的属性，因此有些属性可能在 Mac Safari 上运行良好。
所有三种方法（单个属性、样式属性和类）似乎都可以在所有其他现代浏览器上正常工作。

【讨论】：