本文探讨了SVG在网页中的应用，包括inline SVG、img/object标签、背景与Data URIs、SVG精灵等方法，以及它们的优缺点。针对PC端的兼容性问题，提出了SVG与PNG结合的解决方案。在Vue框架下，推荐使用vue-svg-icon组件，以实现SVG图标的颜色自定义和代码优化。
解决问题
- 最早开始使用的图片形式
多倍图，一般做2倍，在小分辨率下就很浪费
为了挺升用户体验，会分开做几套图片，根据用户的dpi判断加载对应的图片
- 使用iconfont字体图标
iconfont本身就是字体文件，会矢量适配各种不同dpi。支持单色，变色填充
但是在PC上当图标小于等于16px时，或者复杂度高的图标会出现比较
严重锯齿，图标无法展示清晰，特别在chrome下的表现尤为严重。正因为如此这个技术在推进过程中遇到许多困难，因为在很多场景下图标
确实会较小甚至小于16px，而且有些16px的图标如果复杂度较高，iconfont实现出来的icon会经常出现看不清的情况，而且国内PC用户是占
最多的，所以iconfont的这种表现效果很
最低0.47元/天 解锁文章
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
