使用自定义字体的 SVG 渲染在 ipad 上失败

Question

我使用 svg 编写了此文本，并且在我检查时它适用于 chrome 和 IE，但我在 iPad 的 Chome 上没有显示任何内容。

<svg width="180" height="76" xmlns="http://www.w3.org/2000/svg">
 <title>eQuotes</title>
 <defs>
  <style type="text/css">
    @font-face {
        font-family: 'MYFONT';
        src: url('./fonts/berlin.eot');
        src: url('./fonts/berlin.eot?#iefix') format('embedded-opentype'),
            url('./fonts/berlin.woff') format('woff'),
            url('./fonts/berlin.ttf') format('truetype'),
            url('./fonts/berlin.svg#berlin') format('svg');
    }
  </style>
 </defs>
 <g>
  <title>Layer 1</title>
   <text stroke="#7f0000" transform="matrix(1.73839 0 0 1.55447 -176.823 -232.222)" font-weight="bold" xml:space="preserve" text-anchor="middle" font-family="MYFONT" font-size="24" id="svg_40" y="192.68606" x="152.0512" stroke-linecap="null" stroke-linejoin="null" stroke-dasharray="null" stroke-width="0" fill="#000000">Hello There</text>
  </g>
 </g>
</svg>

有什么想法吗？

Answer 1

您的 SVG 是无效的 XML。最后你有一个太多的</g>，并且你有无效的属性值（null）。 Validate your markup，修正您的错误，然后重试。