随着时代的变迁和技术的不断更新，Web中的图标（icons）不再仅仅是局限于<img>。除了<img>直接调用icons之外，还有Sprites（俗称雪碧图）、Icon Font（字体图标）、SVG Icon等等。
前端工程师关心页面可访问姓、性能以及重构的灵活性，可重复性，可维护性等等。
原始的<img>
优势
更换简单方便，只需要修改图标路径或覆盖图标文件名
图标大小易于掌控
劣势
增加HTTP请求，如果页面使用的图标过多，直接拉高了HTTP的请求数，也就直接影响了页面的加载性能。
不易适配各种终端和分辨率，特别是高PPI的显示设备，有可能造成图标模糊
不易修改图标的样式，比如颜色，阴影等
不易维护
Sprites图标（雪碧图）
Web中的图标
原文地址：https://www.cnblogs.com/wss88/p/8269744.html