CSS：（#IDで）マークアップで定義された使用SVG画像

<html> 
.... 
<svg id="my-svg">.....</svg> 
.... 
</html>

で定義されたSVGを持っているが、CSSでこのSVGを使用する方法があり、例えばCSSの背景として？

.a-div { 
    background: url(#my-svg); 
}

2017-05-02 edo

上記の操作はできません。最も近い可能な解決策は、独自のファイル（例えばmy-vector-image.svg）でSVGを保存し、次のCSSを使用することです：

.a-div { 
    background: url(my-vector-image.svg); 
}

あなたはこのhereについての詳細を読むことができます。

2017-05-02 14:41:26

異なる色のページのいくつかの場所で同じイメージが発生しています。どのように私はそれのような何かを得ることができるどのようなヒント？ – edo

私は正直なところ、それを行う最も簡単な方法は、複数のsvgファイルを作成することだと思います。残念ながら、ページの読み込み速度は向上しますが、うまくいけば、svgオプティマイザ/圧縮器を使って実行すると、それほど悪くはありません。 –

答えて