小程序引用iconfont图标的方法
⼩程序引⽤iconfont图标的⽅法
最近在研究⼩程序，⾃⼰写demo的时候想要引⽤巴⾥巴巴图标库的图标，于是：
@font-face {
font-family: 'iconfont';
src: url('');
src: url('?#iefix') format('embedded-opentype'),
url('iconfont.woff') format('woff'),
url('f') 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，然后引⽤。
⽅法：
这⾥贴⼀个简单的步骤：
转换后的⽬录：
将css⽂件在外部引⼊所要⽤的.wxss⽂件中即可（@import ‘../../lib/style/lib.wxss';）
小红旗图标怎么弄最后，就可以使⽤啦：
.icon:after{
font-family: 'iconfont';
font-weight: 500;
font-style: normal;
content: '\e698;'
}
总结
以上所述是⼩编给⼤家介绍的⼩程序引⽤iconfont图标的⽅法，希望对⼤家有所帮助，如果⼤家有任何疑问请给我留⾔，
⼩编会及时回复⼤家的。在此也⾮常感谢⼤家对⽹站的⽀持！

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。