你静候着秋天的温柔，留我在风景之外。把眼睛留给风光，把体重留给美食。我坐在椅子上，看日出复活;我坐在夕阳里，看城市的衰落。
最近在研究微信小程序，自己写demo的时候想要引用巴里巴巴图标库的图标，于是：
@font-face {
font-family: 'iconfont';
src: url('iconfont.eot');
src: url('iconfont.eot?#iefix') format('embedded-opentype'),
url('iconfont.woff') format('woff'),
url('iconfont.ttf') format('truetype'),
url('iconfont.svg#iconfont') format('svg');
}
.iconfont{
font-family:"iconfont";
font-size:16px;font-style:normal;
-webkit-font-smoothing: antialiased;
-webkit-text-stroke-width: 0.2px;
-moz-osx-font-smoothing: grayscale;
}
这是往常的写法，但是发现这样的写法要报错，后来查了一下，发现小程序的wxss文件的font-face的url不接受http地址作为参数,但可以接受base64,因此需将字体文件下载后,转换为base64，然后引用。
方法：
在阿里巴巴图标库下载下来以后，将iconfont.ttf转换即可。转换地址：https://transfonter.org/
这里贴一个简单的步骤：
转换后的目录：
将css文件在外部引入所要用的.wxss文件中即可（@import ‘../../lib/style/lib.wxss';）
最后，就可以使用啦：
.icon:after{
font-family: 'iconfont';
font-weight: 500;
font-style: normal;
content: '\e698;'
}
总结
以上所述是小编给大家介绍的微信小程序引用iconfont图标的方法，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对网站的支持！
以上就是微信小程序引用iconfont图标的方法。在最平凡的生活里，谦卑和努力。总有一天，你会站在最亮的地方，活成自己曾经渴望的模样。今天的努力将成为明天更多的收获！错过的就让它永远的错过。要珍惜眼前的生活，活出自己的人生，为自己的人生加油！五月你好！更多关于微信小程序引用iconfont图标的方法请关注haodaima.com其它相关文章！
