Icon 支持使用 base64 / svg 图片

[warmhug]

移动端 iconfont 在低版本浏览器有兼容问题，需要使用 base64 替换。Icon 除了现在用 font 方式、希望再支持用 base64 图片方式

[afc163]

用 svg 来代替 iconfont，方便修改样式。https://github.com/nolimits4web/Framework7/blob/master/src/less/ios/notifications.less#L72

rn 用图片。

---

补充，上面 svg 的方式设置颜色会很不方便。

[warmhug]

svg 兼容性怎么样？

[afc163]

不知道，你得找 iconfont 不行的机器先试试。

[afc163]

iconfont 应该比 svg 的兼容性更好，weui 用的也是 iconfont，不同的地方是它把 iconfont 直接内联进来了。

https://github.com/weui/weui/blob/master/src/style/icon/weui_font.less

移动端 iconfont 在低版本浏览器有兼容问题

@warmhug 这里是否是网络加载 iconfont 的兼容性问题？

[afc163]

https://io-meter.com/2014/07/20/replace-icon-fonts-with-svg/

[afc163]

两种方式：

1. base64 的 iconfont
2. svg symbols 推荐

[afc163]

https://dmfrancisco.github.io/react-icons/

[SMbey0nd]

iconfont 在前两年，Android 上的问题非常多，很多 case 跟网络加载确实有关系，在加载过程中图标 icon 会变形或出现乱码之类的情况。内联进去是否能解决这个问题不太好说。

svg 我们一年前有过实践，整体感觉兼容性比 iconfont 要好。当时在测试机房里批量测试过，所以心里有底一些。业务上考虑的话可能会首选 svg 稳妥一点。

[warmhug]

@liqi07 尽量这周做完？支持 svg（base64 比较简单、只要有png 源文件即可、工具会自动处理成 base64）

[warmhug]

done

[lock]

This thread has been automatically locked because it has not had recent activity. Please open a new issue for related bugs and link to relevant comments in this thread.