Question

SVG文件未显示在移动设备中，但显示在Google Chrome浏览器下。

  <li>
    <svg class="listnew" xmlns="content/assest/airplane-mode-on.svg"    
    xlink="content/assest/airplane-mode-on.svg" width="100%" height="1000px"
    viewBox="0 0 219.5 66">
   <g>
   <img src="content/assest/fully-wi-fi-connected.svg"  width="40%"   
    height="100px;" />
    <p class="text-content">4 Active Apps</p>
   </g>

   </svg>

    </li>

Answer 1

你的样本有很多问题。

<img>不是有效的SVG元素。 SVG使用<image>元素。
<p>不是有效的SVG元素。它只是HTML。如果要在SVG中放置文本，则需要使用<text>元素。
在<image>元素中，您引用具有xlink:href属性的外部文件。 src是一个HTML内容。

您的图片中包含无效的height属性。删除分号。

<image xlink:href="content/assest/fully-wi-fi-connected.svg" width="40%" height="100px" />

最后，xmlns标记中的xlink和<svg>声明是错误的。你不能选择那些东西。它们硬连线到特定值。虽然它看起来像一个URL实际上不是。它是一个字符串常量。他们有：
```
xmlns:svg="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
```

SVG文件未显示在移动设备中，但显示在Google Chrome浏览器下

1 个答案: