uniapp/微信小程序base64方式引入iconfont
一、准备网站
1、https://www.iconfont.cn
2、https://transfonter.org
二、在iconfont里选择自己想要的图标,将他们添加到项目里。跳转到项目页面后,按下图操作,并下载至本地
三、解压下载出来的zip
四、打开https://transfonter.org
1、add fonts 选择刚才解压出来的文件夹中的iconfont.tff文件,并按下图配置,然后点击convert
五、下载转换后的文件并解压
六、项目内新建xxx.css文件,这里新建一个iconfont_test.css
七、将转换后得到的css文件复制到iconfont_test.css中
八、将原始的css文件内,除了@font-face{}中的内容一同复制到iconfont_test.css中
九、现在你可以按如下方式使用图标
1、引入图标@import '@/iconfont_test.css';
2、<text class="iconfont xxxxxx"></text> // xxxxx 换成你添加的图标名称