我们往往在为客户制作小程序的时候，都是根据设计师的效果图来一比一还原的，设计师经常会用到阿里的iconfont字体来做ui界面上面的图标，字体图标在网页开发中用法非常简单，那么在小程序开发中该如何使用字体图标呢？

今天的教程就教大家：如何在十堰小程序制作中使用阿里的iconfont字体图标。阿里的iconfont图标是阿里妈妈MUX倾力打造的矢量图标管理、交流平台。设计师将图标上传到 iconfont 平台，用户可以自定义下载多种格式的icon，平台也可将图标转换为字体，便于前端工程师自由调整与调用。

第一步：我们将选好的字体图标加入到自己的项目中，选择Font class，然后下载至本地。

第二步：将下载好的压缩包解压出来，接着我们打开 https://transfonter.org 网站，然后在解压出来的文件夹中找到"iconfont.ttf"文件，上传上去，在Convert转换前，按照下图中的红框进行配置。最后点击转换Convert按钮，转换好后将文件再次下载下来，点击Dowload按钮。

第三步：将转换好并下载下来的压缩包解压出来，然后找到stylesheet.css文件并打开，全选复制里面的所有内容

第四步：将上一步复制的内容粘贴到小程序项目的app.wxss文件内

第五步：找到第一步从阿里iconfont网站下载并解压出来的文件夹，找到iconfont.css文件并打开，除了红框这个代码【不复制】，其他代码全部复制，并粘贴到小程序项目的app.wxss文件内。

第六步：就可以在小程序的.wxml代码中正常使用字体图标了，就跟在网页开发中使用是一样的。

通过以上介绍您是否学会了在小程序开发中使用阿里的iconfont字体图标了呢？