2017-08-31 6 views
0

私は透明な背景を持つSVGイメージを持っています。私はそれに背景色を設定したい。SVGに背景色を設定するには<image>要素

style="background-color: blue" 

fill="blue" 

をし、それらのどれも機能しません:私は試してみました。

このような要素に背景色を設定する方法はありますか?ここ

はjsfiddle例である: https://jsfiddle.net/672ec2n1/15

更新:

Iは画像と同じ大きさと位置を有する長方形を追加することによって、この問題を回避する解決策を見つけ、そこに充填属性を設定します。

https://jsfiddle.net/672ec2n1/17/

+0

私が試したすべてのブラウザ(Chrome、Firefox、IE11)で 'background-color'が動作します。どのブラウザを使用していますか? https://jsfiddle.net/672ec2n1/12/ –

+0

私はクロムを使用しています、赤い背景色は、画像ではなく本体に設定されたCSSからです – YHTsai

+0

私は最後のコメントに更新されたフィドルを追加しました。 –

答えて

1

これを試しましたか?

svg {background-color: blue;} 
+0

私の場合は、要素をsvgタグの下に置いて、背景色のみを画像に適用したいと考えています。 – YHTsai

+0

その場合は、svgタグにクラスを追加し、色を追加してください。このfiddleを確認してください。https://jsfiddle.net/Lpa6vp51/ – Znaneswar

関連する問題