1

以下 SVG<image>标记在 Firefox 25 或 IE10 中不显示任何内容。它确实在 Chrome 中工作。我在这里做错了什么？

测试.html

<!DOCTYPE html>
<html>
  <head>
    <title></title>
    <script type="text/javascript">
    </script>
  </head>
  <body>
    <svg width="4in" height="3in" version="1.1" viewBox="0 0 500 500"
        xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
      <image x="50" y="50" width="100px" height="100px" xlink:href="test.svg"></image>
    </svg>
  </body>
</html>

测试.svg

<svg xmlns="http://www.w3.org/2000/svg"
   version="1.1"
   width="463.85715"
   height="375.28571"
   id="svg2">
  <g
     id="layer1">
    <rect
       width="462.85715"
       height="374.28571"
       x="145.71429"
       y="80.933617"
       id="rect2985"
       style="fill:#ff0000;fill-opacity:1;stroke:#000000;stroke-opacity:1" />
  </g>
</svg>
4

1 回答 1

1

问题是 svg 文件中的根元素需要一个viewBox属性。这就是我从我正在处理的测试用例中删除 Inkscape 的代码所得到的......

于 2013-10-30T23:14:41.130 回答