小程序页面引入iconfont的css文件

刚写demo写到这里，一直用的图片，花了几分钟琢磨了一下字体文件引入方式；在这里做个分享也方便自己以后使用记录，请大家多多指教！

小程序引入外部文件的方式是：@import "*/*.wxss";

如果所有页面都要使用的话：@import"/lib/style/font.wxss",用这种方式导入到app.wxss就可以了。

在此之前要做的准备工作：

1.在iconfont网站http://iconfont.cn/下载图标代码；

2.找到.ttf文件，在https://transfonter.org/进行base64格式转码之后下载；转码后的文件像这样

3.准备一个目录，新建一个wxss文件，将下载转码后的 iconfont.css内容复制到新建的wxss文件中，我的文件目录结构为：

注：我这里的eot，woff等文件是用转码后的文件做了替换的，没有替换的情况能不能成功我没有试过。

4.在app.wxss中引入@import"/lib/style/font.wxss；

最后一步就是按照平常的方式，在代码中用iconfont + 图标类名进行使用。

如果看完了没有明白，这里附上原教程地址：【微信小程序】——wxss引用外部CSS文件及iconfont