1 .进入阿里图库网站: http://www.iconfont.cn 2 .选择所需图标放入购物车(如果不想用unicode方式使用图标,直接下载png等形式即可
3 .在浏览器右上角进入购物车,然后单击下载代码
4 .解压缩后,选择并复制下图中的五个文件。 其他是demo文件,教你使用方法。
5 .在项目的assets目录下创建了一个新的fonts目录,并放入了这五个文件
打开iconfont.css,为了方便起见,更改了默认图标变量名称,并将图标大小font-size更改为24px
7 .然后将此css文件导入main.js
8 .然后我在我的Home.vue文件中使用这两个图标
9 .最后一个屏幕上显示的效果如下图所示
注: i标签中的class第一个参数,第一个参数一定是iconfont,第二个参数是iconfont.css中收起和展开下面的icon-menu-***