Question

我在HTML页面中嵌入了一些内联SVG代码，例如：

<html>
  <head><title>Some HTML</title></head>
  <body>
    <svg viewBox="0 0 400 20" xmlns="http://www.w3.org/2000/svg">
      <text y="20" font-size="20">Some text</text>
    </svg>
  </body>
</html>

是否存在一些标准兼容的方法来屏蔽不支持SVG的（旧）浏览器中SVG中的文本？没有使用某些精美的图片替换技术（JavaScript还是CSS）？

到目前为止，我只是有一些想法（但无法解决）：

是否有一些SVG元素接受文本作为属性并显示它？
是否有某种方法可以掩盖注释标记的开头和结尾，以使SVG解析器看不到它，而HTML可以看到它？
是否有某种方法可以将某些html标记的开头和结尾分别插入到svg中而不显示出来？

Answer 1

万一有人偶然发现该页面，并且有相同的问题：这实际上不是对该问题的答案，而只是潜在问题的解决方法（直到有希望的人提出了 real 解决方案）：

我实际上向SVG添加了一些更多信息，这本身就很有意义，而且还可以与其他文本部分结合使用，例如：

<html>
  <head><title>Some HTML</title></head>
  <body>
    <svg viewBox="0 0 400 400" xmlns="http://www.w3.org/2000/svg">
      <desc>
        Some website is displayed on a computer monitor. 
        The locationbar reads: 
      </desc>
      <text x="25" y="40" font-size="16">http://example.com/</text>
    </svg>
  </body>
</html>

https://developer.mozilla.org/en-US/docs/Web/SVG/Element/desc

内联SVG：从旧浏览器隐藏纯文本的方法？

1 个答案: