1

好吧，这是我在 svg 图像上的一个标签，它在所有浏览器上都可以正常工作，除了 Safari，它不会显示，我不明白为什么 svg 的这一部分没有显示......

<g>
  <g>
       <defs>
    <rect id="SVGID_7_" x="221.463" y="851.163" width="187.789" height="38.692"></rect>
       </defs>
       <clipPath id="SVGID_8_">
            <use xlink:href="#SVGID_7_" overflow="visible"></use>
       </clipPath>
       <path clip-path="url(#SVGID_8_)" fill="#120F0B" d="M221.463,862.222c0-2.149,1.755-3.904,3.902-3.904h76.462 c2.146,0,5.144-1.242,6.662-2.759l3.254-3.255c1.52-1.52,4.003-1.522,5.522-0.003l3.255,3.258 c1.521,1.517,4.516,2.759,6.665,2.759h78.164c2.146,0,3.902,1.755,3.902,3.904v23.73c0,2.146-1.756,3.903-3.902,3.903H225.365c-2.147,0-3.902-1.757-3.902-3.903V862.222z"/>
   </g>
   <text transform="matrix(1 0 0 1 277.3213 876.9551)" fill="#FFFFFF" font-family="'FedraSansStd-Normal'" font-size="9.64">Drinkwaterbalans</text>
</g>

这是顶部的 svg 标签：

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" 
     xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
     width="600px" height="1000px" viewBox="0 0 625 1000"
     enable-background="new 0 0 625 1000" xml:space="preserve" 
     preserveAspectRatio="xMinYMin none">
4

2 回答 2

0

找到了答案！

如果我删除：

<defs>
       <rect id="SVGID_7_" x="221.463" y="851.163" width="187.789" height="38.692"></rect></defs>
<clipPath id="SVGID_8_">
       <use xlink:href="#SVGID_7_" overflow="visible"></use>
</clipPath>

甚至在 Safari 中也会显示图形！并纠正

于 2013-06-25T22:05:17.133 回答
-1

您需要将 SVG 声明放在 SVG 标签之前。<g>在标记之后添加标记，并将<body>标记放在<svg>标记之后<g>。

于 2015-07-01T14:04:32.690 回答