uni-app使用iconfont

1. 使用阿里在线图标,联网刷新图片显示:

a. 阿里Iconfont创建项目,添加所需图标,生成代码:

uni-app使用iconfont_第1张图片

b. 下载至本地,代码包,保留.css文件:

uni-app使用iconfont_第2张图片

c. 替换css文件中@font-face{}代码段为a步骤代码段,//at.alicdn.com/t…前面加https: ;

d. 文件中使用iconfont:

uni-app使用iconfont_第3张图片

2. 使用阿里离线图标,图片显示, 小于 40kb 的字体文件可以直接本地引用:

a. 阿里Iconfont创建项目,下载字体文件,删除多余文件,留下 iconfont.ttf 和 iconfont.css 文件使用;

b. 修改 iconfont.css 文件@fontface{}中,如下:

uni-app使用iconfont_第4张图片

c. 使用同上。

你可能感兴趣的:(uni-app使用iconfont)