iconfont 是一个矢量图标平台，相信用过的小伙伴都知道它的强大，图标很齐全并且提供多种格式的下载。同时该平台也可提供图标转换为字体，便于前端工程师自由调整与调用。接下来我们就一起来看看iconfont如何在web中应用吧！
工具/原料
前端开发工具（webstorm、sublime、dreamweaver等）、iconfont官网
方法/步骤
2
登录后搜索你前端项目中需要的图标，如“个人中心”，图标展示区就会出现很多“个人中心”的图标，选择你需要的图标加入购物车即可；
3
点击购物车图标，便会在右边的窗口显示购物车里的信息;
4
这时选择“添加至项目”，在弹出的对下拉框中点击“加号”，添加新的项目名“a项目”，然后点击“确定”；
5
“确定”进入项目列表，选择刚刚新建的“a项目”，右边的图标显示区即可看到刚刚添加的图标信息；
6
在图表信息中，上面有三个选项，从左往右第一个选项是控制类名的、第二个是生成在线代码链接地址的、第三个就是下载至本地的图标代码文件包；
7
这时你需要点击第三个选项“下载至本地”，把项目下载到本地电脑并解压，然后将文件中的iconfont.css，引入到你的项目中；
8
准备工作做好后，将需要该图标的地方用的形式引入即可，其中的类名复制图标下的“复制代码”即可得来！
9
多图标是同样的道理，只是首先需要将多个图标“加入购物车”，然后“添加至项目”，最后用同样的方式引入你的前端项目中即可！奋斗中的小伙伴儿你明白了吗？
上一篇：如何快速制作ico图标