CSS精灵图
在网页布局中有许多的小图标，这些图标都是由字体图标来进行实现的。
字体图标的产生
在早期这些字体图标也使用精灵图进行实现，但是精灵图也有其自身缺点：
- 图片文件还是比较大的。
- 图片本身放大和缩小会失真。
- 一旦图片制作完毕想要变更非常复杂。
此时，字体图标的技术就完美的解决了以上的问题
字体图标可以为前端工程师提供同一种方便高效的图标使用方式，展示的是图标，本质属于字体。
字体图标的优点
- 轻量级：一个图标字体要比一系列的图像要小 。一旦字体加载了，图标马上就会渲染出来，减少了服务器的请求。
- 灵活性：本质其实是文字，可以很随意的改变颜色、产生阴影、透明效果、旋转等。
- 兼容性：几乎所有浏览器都支持。
注意：字体图标并不能代替精灵技术，只是对工作中图标部分技术的提升和优化。
字体图标的使用
字体图标的下载
字体图标可以去相应的图标网站进行下载，这里推荐两个网站：
这里以icomoon为例子，详情看pink老师的视频。
字体图标的使用
根据以上视频下载好字体图标后，会得到一个.zip压缩文件。
将其中的fonts目录放到项目中。
然后将其中的style.css中的字体图标声明，复制到css的开头。
这里仍然以pink老师的视频为例子。
