最近在搞一个html网页，纯纯小白，遇到什么问题都要一个个去查、去解决。
写这篇blog也就是因为在搞网页的过程中，看着黑色icon不顺眼，想换个颜色，于是去找方法解决。
所以这是一个在试了多种方法，遇到许多奇奇怪怪问题之后，终于成功了的故事。
下面介绍一下自己成功更换icon颜色的方法。
1.我的html里面使用img标签直接调用本地下载下来的icon.svg图片，用来在网页中显示；
（person-outline.svg是我在https://ionic.io/ionicons下载下来，存放于本地的）
<img src="{% static "icon/person-outline.svg" %}" style="display:block" >运行我的网页，初始效果是这样的：
2.我想换个其他颜色，于是尝试了下面这种方法。
找到本地该图标的.svg文件，用记事本打开，可以看到如下内容。
改变颜色的关键在这里面的fill和stroke两个值。
我首先将第一个fill的值改为了“#8FAADC”
（要用十六进制，别写代码习惯了直接用英文，别问我怎么知道的😥）
结果变成了这样：
这下我知道了，图标和印章一样，也是分阴阳的。（毕竟我对html真的纯小白😂）
于是我就保持fill不动，改变所有stroke的值为“#8FAADC”，得到结果：
是不是有哪里不对劲？
是的，为啥其他线条都变了，就剩一个点还是黑色的！！！
这就是下一个需要关注的点了……
3.后来通过再读svg我发现，里面共有4个path，但fill和stroke对才出现了3次，最后一个path中，只有一个d值，这好像就是那个黑点点了……
于是我就直接在最后一个path里面试着分别添加fill或stroke，第一次就成功，然后黑点就顺利变色了！
最终我将svg改成了这样（红色的地方是我改过的）：
最后出来的效果：
到此，又一个小问题终于被解决……
2637
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
