微信小程序使用字体图标的方法


Posted in Javascript onMay 23, 2019

项目中常常需要使用到字体图标,微信小程序中使用字体图标与在平常的web前端中类似但是又有区别。下面以使用阿里图标为例子讲解如何在微信小程序中使用字体图标。

第一步:下载需要的字体图标

进入阿里图标官网http://iconfont.cn/搜索自己想要的图标,如这里需要一个购物车的图标,流程为:

搜索“购物车”图标--->点击“添加入库”-->点击购物车进入购物车-->点击下载代码按钮。

微信小程序使用字体图标的方法

点击下载代码,将得到名为download.zip的压缩包,解压将看到以下内容:

微信小程序使用字体图标的方法

第二步:转换ttf文件

进入https://transfonter.org/平台,将解压出来的ttf字体文件转化成base64格式。流程如下:

微信小程序使用字体图标的方法

微信小程序使用字体图标的方法

点击下载,得到转换后的压缩包,名为transfonter.org-开头。解压可以得到如下图的几个文件:

微信小程序使用字体图标的方法

第三步:在微信小程序中使用

新建微信小程序,将默认生成的代码删除。

1--在index.css文件中添加样式内容。打开刚刚我们经过转换的解压出来的文件,找到stylesheet.css,将其中的内容全部复制到index.css文件中。注意是转换过的那个文件。

微信小程序使用字体图标的方法

2--打开没有转换过的download.zip解压出来的文件,找到iconfont.css文件,将这个文件中的没有打岔的内容复制到index.css文件中。@font-face这部分不要,只要下边的这部分。

微信小程序使用字体图标的方法

3--在index.wxml中使用字体图标。代码如下:

<!--index.wxml-->
<view class="container">
个人中心
<text class="iconfont icon-wode" style="font-size:50px;color:red"></text>
</view>

效果如下:

微信小程序使用字体图标的方法

字体图标跟字体一样,可以通过font-size来改变大小,通过指定color来改变他的颜色。

总结:到这里微信小程序的字体图标的使用就完成了,这里经过转换成64位编码之后,直接将样式放在css文件中即可,并不需要引入其他以外的文件,相当简洁。

附上css全部代码:

/* This stylesheet generated by Transfonter (https://transfonter.org) on July 3, 2017 11:03 AM */
 
@font-face {
 font-family: 'iconfont';
 src: url(data:font/truetype;charset=utf-8;base64,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IyA8IC4jOLEkARQrLbA6LLEJBCVCsAAWsAQlsAQlIC5HI0cjYSCwBCNCsAZFKyCwYFBYILBAUVizAiADIBuzAiYDGllCQiMgR7AEQ7CAYmAgsAArIIqKYSCwAkNgZCOwA0NhZFBYsAJDYRuwA0NgWbADJbCAYmGwAiVGYTgjIDwjOBshICBGI0ewACsjYTghWbEkARQrLbA7LLAuKy6xJAEUKy2wPCywLyshIyAgPLAEI0IjOLEkARQrsARDLrAkKy2wPSywABUgR7AAI0KyAAEBFRQTLrAqKi2wPiywABUgR7AAI0KyAAEBFRQTLrAqKi2wPyyxAAEUE7ArKi2wQCywLSotsEEssAAWRSMgLiBGiiNhOLEkARQrLbBCLLAJI0KwQSstsEMssgAAOistsEQssgABOistsEUssgEAOistsEYssgEBOistsEcssgAAOystsEgssgABOystsEkssgEAOystsEossgEBOystsEsssgAANystsEwssgABNystsE0ssgEANystsE4ssgEBNystsE8ssgAAOSstsFAssgABOSstsFEssgEAOSstsFIssgEBOSstsFMssgAAPCstsFQssgABPCstsFUssgEAPCstsFYssgEBPCstsFcssgAAOCstsFgssgABOCstsFkssgEAOCstsFossgEBOCstsFsssDArLrEkARQrLbBcLLAwK7A0Ky2wXSywMCuwNSstsF4ssAAWsDArsDYrLbBfLLAxKy6xJAEUKy2wYCywMSuwNCstsGEssDErsDUrLbBiLLAxK7A2Ky2wYyywMisusSQBFCstsGQssDIrsDQrLbBlLLAyK7A1Ky2wZiywMiuwNistsGcssDMrLrEkARQrLbBoLLAzK7A0Ky2waSywMyuwNSstsGossDMrsDYrLbBrLCuwCGWwAyRQeLABFTAtAABLuADIUlixAQGOWbkIAAgAYyCwASNEILADI3CwDkUgIEu4AA5RS7AGU1pYsDQbsChZYGYgilVYsAIlYbABRWMjYrACI0SzCgkFBCuzCgsFBCuzDg8FBCtZsgQoCUVSRLMKDQYEK7EGAUSxJAGIUViwQIhYsQYDRLEmAYhRWLgEAIhYsQYBRFlZWVm4Af+FsASNsQUARAAAAAAAAAAAAAAAAAAAAAAAAAAAMgAyAxj/4QNS/ywDGP/hA1L/LAAAAAAAAAAA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) format('truetype');
 font-weight: 500;
 font-style: normal;
}
 
.iconfont {
 font-family:"iconfont" !important;
 font-size:16px;
 font-style:normal;
 -webkit-font-smoothing: antialiased;
 -moz-osx-font-smoothing: grayscale;
}
 
.icon-search:before { content: "\e611"; }
.icon-youjiantou:before { content: "\e603"; }
.icon-daifukuan:before { content: "\e684"; }
.icon-daishouhuo:before { content: "\e642"; }
.icon-wode:before { content: "\e606"; }
.icon-icon:before { content: "\e64b"; }
.icon-diliweizhishezhi:before { content: "\e616"; }
.icon-daifahuo:before { content: "\e678"; }
.icon-daipingjia:before { content: "\e619"; }
.icon-shouye:before { content: "\e69d"; }

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript学习之闭包分析
Dec 02 Javascript
自动最大化窗口的Javascript代码
May 22 Javascript
优化Jquery,提升网页加载速度
Nov 14 Javascript
引入JS文件IE6报语法错误或缺少对象问题的解决方法
Jan 09 Javascript
JS创建对象的写法示例
Nov 04 Javascript
javascript中json对象json数组json字符串互转及取值方法
Apr 19 Javascript
js+html5实现页面可刷新的倒计时效果
Jul 15 Javascript
vue上传图片组件编写代码
Jul 26 Javascript
解决vue2 在mounted函数无法获取prop中的变量问题
Nov 15 Javascript
如何换个角度使用VUE过滤器详解
Sep 11 Javascript
vue在路由中验证token是否存在的简单实现
Nov 11 Javascript
ES6中new Function()语法及应用实例分析
Feb 19 Javascript
个人小程序接入支付解决方案
May 23 #Javascript
一篇文章介绍redux、react-redux、redux-saga总结
May 23 #Javascript
微信小程序上传图片到php服务器的方法
May 23 #Javascript
React精髓!一篇全概括小结(急速)
May 23 #Javascript
微信小程序实现上传word、txt、Excel、PPT等文件功能
May 23 #Javascript
微信小程序实现文件、图片上传功能
Aug 18 #Javascript
微信小程序实现图片上传
May 23 #Javascript
You might like
php设置session值和cookies的学习示例
2014/03/21 PHP
javascript 多浏览器 事件大全
2010/03/23 Javascript
jQuery选中select控件 无法设置selected的解决方法
2010/09/01 Javascript
js判断字符长度以及中英文数字等
2013/12/31 Javascript
JavaScript代码里的判断小结
2016/08/22 Javascript
Angular.Js的自动化测试详解
2016/12/09 Javascript
js自制图片放大镜功能
2017/01/24 Javascript
微信小程序 自定义Toast实例代码
2017/06/12 Javascript
NodeJS链接MySql数据库的操作方法
2017/06/27 NodeJs
ReactJS实现表单的单选多选和反选的示例
2017/10/13 Javascript
vue中实现滚动加载更多的示例
2017/11/08 Javascript
vue使用element-ui的el-input监听不了回车事件的解决方法
2018/01/12 Javascript
对node.js中render和send的用法详解
2018/05/14 Javascript
傻瓜式解读koa中间件处理模块koa-compose的使用
2018/10/30 Javascript
解决axios post 后端无法接收数据的问题
2019/10/29 Javascript
基于Vue+ElementUI的省市区地址选择通用组件
2019/11/20 Javascript
[46:23]OG vs EG 2018国际邀请赛淘汰赛BO3 第一场 8.23
2018/08/24 DOTA
Python通过Pygame绘制移动的矩形实例代码
2018/01/03 Python
关于python之字典的嵌套,递归调用方法
2019/01/21 Python
Python批量生成幻影坦克图片实例代码
2019/06/04 Python
python卸载后再次安装遇到的问题解决
2019/07/10 Python
对YOLOv3模型调用时候的python接口详解
2019/08/26 Python
Python 最强编辑器详细使用指南(PyCharm )
2019/09/16 Python
Pandas缺失值2种处理方式代码实例
2020/06/13 Python
CSS3的RGBA中关于整数和百分比值的转换
2015/08/04 HTML / CSS
英国儿童鞋和靴子:Start-Rite
2019/05/06 全球购物
土木工程专业大学毕业生求职信
2013/10/13 职场文书
护理专业优质毕业生自荐书
2014/01/31 职场文书
见习期自我鉴定
2014/01/31 职场文书
教育技术职业规划范文
2014/03/04 职场文书
食品安全汇报材料
2014/08/18 职场文书
2014年中秋节活动总结
2014/08/29 职场文书
幼儿园小班教育随笔
2015/08/14 职场文书
SqlServer: 如何更改表的文件组?(进而改变存储位置)
2021/04/05 SQL Server
JS新手入门数组处理的实用方法汇总
2021/04/07 Javascript
二维码条形码生成的JavaScript脚本库
2022/07/07 Javascript