iconfont-阿里巴巴矢量图标库的使用方法

官网:iconfont-阿里巴巴矢量图标库iconfont-国内功能很强大且图标内容很丰富的矢量图标库，提供矢量图标下载、在线存储、格式转换等功能。阿里巴巴体验团队倾力打造，设计和前端开发的便捷工具http://www.iconfont.cn

使用方法：

1.  注册账号

2.  登录后可搜索自己想要的字体图标

3.  例如：搜索weibo

4.  鼠标滑到自己想要的图标后，点击第一个购物车图形

 

5.  可在右上方的搜索框搜索下一个自己想要的图标，并加入购物车。

6.  选择完毕后，点击右上方的购物车图样

7.  然后点击添加至项目

8.  点击“加入项目”’右边的图样，该图样表示新建一个项目

9.    输入新建项目的名字,点击确定

10.  在弹出的界面中点击“暂无代码，点此生成”

11.  双击出现的链接

12.  将弹出的界面的代码全部复制，粘贴放入一个新建的css文件中

13.   在html文件中引入该新建的css文件

14.  复制弹出字体图标代码界面的网址：

15.  同样将该网址引入html文件中

16.  如下图所示，将“iconfont” 和所需要引入的字体图标前的名字复制

17.  放入div中

 

18.  字体图标的样式可在原来复制粘贴图标代码的css文件（如第16条下的图片）中直接修改，也可另建一个新的css文件，在其中修改

以第17条下的图片为例，展现出来的效果：