如何将 SVG 嵌入到单个 hta/htm 文档中



我的最终目标是将 svg 图像用于 css 背景,如下所示:

#somelement {
  background: transparent url(#embededSvg) repeat-x;
}

我需要(想要*)两件事才能工作, 1. svg 嵌入到文档中(但不是像块一样呈现)女巫,我可以使用:

    Skip<svg ... style="display:none;">...</svg>
  1. 在其 x 轴上循环的 svg 作为 css 背景(无需将无关的文件与 hta/htm 文档打包)。

我尝试将 svg 创建为 Javascript Image 对象并将对象 innerHtml 设置为 svg,但我不确定如何在 css 中引用 Image 对象。

您的想法是正确的,您将链接 SVG,就像图像文件

的链接一样:
<style>
  #somelement {background: transparent url('someimage.svg') repeat-x;}
</style>

甚至像这样:

<style>
  #somelement {background: transparent url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNzUiIGhlaWdodD0iMjc1Ij48L3N2Zz4%3D') repeat-x;}
</style>

并非所有浏览器都支持 CSS 背景中的 SVG。 浏览器对此的支持如下所示:

http://caniuse.com/#feat=svg-css

SVG 可以通过 6 种方式

添加到页面中它们是:

1) 对象标签



3) 内嵌框架


4) 内联 SVG


5) IMG标签


6)


看到这个: https://www.sitepoint.com/add-svg-to-web-page/

具有背景重复


的 SVG看到这个:-为什么背景重复:无重复不适用于 Opera 12 中的.svg图像?

会是这样的
{background:url('image.svg ') repeat-x;}

相关内容

  • 没有找到相关文章

最新更新