- 原生小程序引入
找到阿里图标库下载自己想要使用的图标,并将代码下载到本地
阿里图标库地址:https://www.iconfont.cn/
(1)将选好的图标加入购物车
(2)点开购物车,下载代码至本地
(3)解压文件夹, 找到后缀为.tff的文件,并打开文件转换的网址 https://transfonter.org/ ,将该文件进行转换, 转换成功后下载到本地
(4)下载成功后, 解压, 打开stylesheet.css, 并复制这个文件中的所有代码.
(5)将复制的stylesheet.css中所有的代码去替换原来的iconfont.css文件中的第一坨代码段
(6)将修改后的iconfont.css文件放入项目目录中, 并将后缀改为.wxss
(7) 在app.wxss全局, 或者想要使用的某一个页面的wxss引入该iconfont.wxss文件即可
(8)然后在项目中就可以正常使用啦~
- uniapp中小程序引入
(1) 下载iconfont的代码到本地, 解压到本地, 将后缀为.css, .tff(如果还有.woff, .woff2也一并)的文件放到自己的项目目录结构当中
(2)打开iconfont.css文件,修改src中的地址为本地路径
(3) 最后在根目录下的uni.scss(在Hbuilder创建项目时模板选的是uni-ui)文件中全局引入iconfont.css
(4)然后就可以在项目中正常使用啦~