指定一个SVG作为背景图像，ALSO风格的CSS中的SVG？ [英] Specify an SVG as a background image and ALSO style the SVG in CSS?

问题描述

可以指定一个SVG作为背景图片，并在同一CSS文件中ALSO风格的SVG吗？

我很舒服放置，缩放和剪切SVG图像作为单个文件或精灵，但我没有能够解决，如果可能的样式SVG在同一个CSS文件中设置为背景图像。

在伪CSS中，我想根据父元素的类别来改变简单形状的颜色：

  element1 {
 background-image（icon.svg）; 
} 
 
 element1.black .svg-pathclass {
 fill：＃000000; 
} 
 
 element1.white .svg-pathclass {
 fill：#ffffff; 
} 
  

显然，这假定SVG中的路径具有类.svg-pathclass

这是可能的吗？

解决方案

SVG必须在一个文档（可能是数据URI 或外部引用的文件）中准备，并且然后作为另一个文件中的背景。

Is it possible to specify an SVG as a background image and ALSO style the SVG in the same CSS file?

I'm very comfortable placing, scaling and clipping SVG images as either single files or sprites, but I haven't been able to work out if it possible to style the SVG within the same CSS file as sets it as a background image.

In pseudo CSS i'd like to do the following to vary the colour of simple shape based on the class of the parent element:

element1 {
 background-image(icon.svg);
}

element1.black .svg-pathclass {
 fill: #000000;
}

element1.white .svg-pathclass {
 fill: #ffffff;
}

obviously this assumes a path in the SVG having class .svg-pathclass

is this possible?

解决方案

No, this is not possible. The SVG has to be prepared in one document (which may be a data URI or an externally referenced file) and then used as a background in another file.

这篇关于指定一个SVG作为背景图像，ALSO风格的CSS中的SVG？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！