1

ここでの私の最終目標は、次のようにcss背景にsvg画像を使用することです。

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

動作させるには（欲しい*）2つのことが必要です。1。svgはドキュメントに埋め込まれています（ただし、ブロックのようにはレンダリングされません）。

    Skip<svg ... style="display:none;">...</svg>
  1. svgは、cssバックグラウンドとしてx軸でループします（hta / htmドキュメントで無関係なファイルをパックすることなく）。

svgをJavascriptImageオブジェクトとして作成し、オブジェクトinnerHtmlをsvgに設定しようとしましたが、cssでImageオブジェクトを参照する方法がわかりません。

4

2 に答える 2

0

あなたは正しい考えを持っており、画像ファイルが次のようにリンクされるのと同じように 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

于 2012-09-24T22:16:34.047 に答える