将填充（颜色）应用于SVG图像

我一直试图使用fill对svg应用不同的颜色，但没有成功。不知道我做错了什么！这是我的jsfiddle。谢谢。将填充（颜色）应用于SVG图像

2014-12-03 Labanino

你需要把填充的图像文件英寸图像不是可以外部修改的（认为它们具有光栅图像的功能，并且不会有太大的错误）。 – 2014-12-03 18:56:27

您无法更改img标记中的SVG图像。你应该像这样在你的HTML内嵌SVG图像：

<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"> 
    <path d="M0 0h24v24h-24z" fill="none"/> 
    <path class="check" d="M12 1l-9 4v6c0 5.55 3.84 10.74 9 12 5.16-1.26 9-6.45 9-12v-6l-9-4zm-2 16l-4-4 1.41-1.41 2.59 2.58 6.59-6.59 1.41 1.42-8 8z"/> 
</svg>

来源

2014-12-03 18:58:03 user1620220

那么，我在Illustrator中用'SVG代码'得到''然后呢？或者有其他方法？ – Labanino 2014-12-03 21:37:42

不确定你在问什么。您可以使用Illustrator，Inkscape或几乎任何文本编辑器来打开SVG图像以查看标记。 – user1620220 2014-12-03 21:48:14

酷男！谢谢。 – Labanino 2014-12-03 22:35:19

你不能改变svg文件的颜色。你需要有实际的svg标签和路径，而不是img标签。

http://jsfiddle.net/hhoa8v9e/1/

<svg width="4cm" height="4cm" viewBox="0 0 400 400" 
    xmlns="http://www.w3.org/2000/svg" version="1.1" id="triangle"> 
    <path d="M 100 100 L 300 100 L 200 300 z" 
     stroke="blue" stroke-width="3" /> 
</svg> 


#triangle { 
    fill:blue; 
}

来源

2014-12-03 18:58:13 cport1

将填充（颜色）应用于SVG图像

回答

相关问题