引入font-icon字体图标至VUE项目中

登陆阿里巴巴矢量图库

然后找到需要的图标,然后下载至本地,把以下文件


引入font-icon字体图标至VUE项目中_第1张图片

拉到项目中的fonts文件夹下 然后在APP.VUE文件中引入

引入方法如下


然后就可以使用了


引入font-icon字体图标至VUE项目中_第2张图片

之前的header文件修改如上,效果如下


引入font-icon字体图标至VUE项目中_第3张图片

注意:使用字体图标可以设置颜色 (color,font-size等)

同时也注意因为不是同一套图标,大小都会有不一样的地方,所以有UI的基础的朋友可以自己画一套大小差不多的 然后上传到阿里巴巴图库方便别人使用,自己找的大小不一,只能将就使用,真正开发中还是要UI配合的 !

你可能感兴趣的:(引入font-icon字体图标至VUE项目中)