标签：font 微信 iconfont 引用 wxss class 图标

本文地址： https://www.cnblogs.com/veinyin/p/15152278.html

 

基于通过微信开发者工具新建的原始微信小程序工程

由于无 css 文件，取而代之的是 wxss，通过 symbol 和 font class 在线引入的方式不再适用

可以采用以下方式，需要创建一个 iconfont 的 wxss 文件，引入后就可以全局使用了

 

1 在工程目录下创建一个 iconfont.wxss 文件，在 app.wxss 中引入

 

  

2 类型选择 font class，点击链接，在新窗口预览 css 内容，全部复制

 

 

 

 

 

3 将复制的 iconfont 相关类贴到 iconfont.wxss 中

 

 

4 使用，size 和 color 不生效，需要设置 class 之后，在样式里面设置

<icon class="iconfont icon-jiarufangjian-01"></icon>

 

补充内容：

1 图标字体小程序推荐 ttf、woff (woff2不兼容低版本iOS)

2 如果有彩色图标，但是使用时是黑白的，可以将 iconfont 网站，项目设置/字体格式/彩色 勾选上

3 如果有图标更新、需要将 iconfont.wxss 更新为新生成的 CSS 内容

4 如果按照以上流程操作，图标还是没有展示出来，可以重新打开模拟器试试

 

标签：font,微信,iconfont,引用,wxss,class,图标
来源： https://www.cnblogs.com/veinyin/p/15152278.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。