搞快点

在微信小程序中使用 iconfont

iconfont 选择好需要使用的图标,将代码下载,解压后找到 iconfont.css 修改名称为 iocnfont.wxss 放到项目中即可

使用: Font class 方式

<icon class="iconfont icon-xxx"></icon>

将无效的字体引用删除,只保留 base64 引用

@font-face {
  font-family: 'iconfont';
  src: url('data:application/x-font-woff2;charset=utf-8;base64,...') format('woff2');
}

Font class 方式不支持使用彩色图标,且 symbol 方式也无法使用,因为 iconfont.js 中含有操作 dom 的代码,会报错 Cannot read property ‘getElementsByTagName’ of undefined

如果想引入彩色图标

https://github.com/iconfont-cli/mini-program-iconfont-cli

赞(0) 打赏
未经允许不得转载:稻草人 » 在微信小程序中使用 iconfont

评论 抢沙发

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址