阿里矢量图标库的使用

1、注册登录账号

网站地址：https://www.iconfont.cn/

该网站可通过GitHub或新浪账号进行登录

下面是网站的首页

2、查找图标

在中间输入框输入想要查找的图标,。以‘home’为例，点击搜索，即可得到以下页面。

3，将图表添加至项目。

选中自己需要的图标，将其添加入库，这时再点击页面右上角的购物车图标

弹出以下页面，点击添加至项目，如果是新建项目，点击右边的加号图标，然后点击确定

 

 

 

4，在项目中使用图标

添加至项目后会跳转至以下页面，左边显示项目的名称，右上角可以添加项目成员，共享这些图标。要使用这些图标的话就需要下载至本地了。

点击下载至本地，会得到一个压缩文件，解压文件，得到以下内容

将上图5个文件放入项目的目录下，并在main.js文件中引入css文件。

用浏览器打开fontclass.html文件，将图标的类名添加至 i 标签即可，如下所示。

<i class="iconfont icon-home"></i>

 

转载于:https://www.cnblogs.com/thinkguo/p/10250271.html