如何轻松愉快地在微信小程序中应用SVG图标？

本文共计553个文字，预计阅读时间需要3分钟。

SVG近几年来因多种优势被广泛应用，遗留下来的问题是目前微信小程序不支持以XML格式使用SVG，这大大降低了SVG的灵活性，导致很多人选择放弃在微信小程序中使用SVG图标方案。

SVG近几年因各种优势被大量的应用，遗憾的是到目前为止微信小程序并不支持以XML的形式使用SVG，这使得SVG的灵活性大大下降，大多数人选择放弃在微信小程序中使用SVG图标方案。
那么，真的就没有办法在微信小程序中愉快的使用SVG图标了吗？我们先来分析一下，对于使用SVG图标我们有哪些需求：

• 能够引入使用
• 能够调整颜色

首先第一点是没有问题的，微信小程序支持以Image.src的形式引入SVG。接下来就是本文的重点部分了，如何让使Image形式的SVG可以改变颜色。

在最近对CSS的学习中，我发现有个属性可以可以使DOM的非透明部分投下一个阴影，这个属性就是drop-shadow，属性的值与box-shadow大致相近。通过这个属性，我们就可以为SVG图片投下个可以修改颜色的阴影，然后我们再将原来的部分隐藏掉就可以实现一个可以修改颜色的SVG图标了。