一、挑选icon,生成文件在微信小程序中，我们可以使用icon来为页面和功能添加图标，增加用户体验。为了使用icon，首先需要挑选合适的图标，并生成相应的文件。
1、打开阿里icon 将项目下载到本地在选择完符合需求的图标后，通过购物车页面中的“下载至本地”按钮，可以将所选图标一键下载到本地电脑中。下载完成后，解压文件，就可以看到所选图标生成的文件夹。
3. 下载文件的目录结构解压目录结构主要包括以下几个文件：
- demo_index.html：图标的展示页面，可以直接在浏览器中打开，通过点击图标来复制相应的代码。
- iconfont.css：图标的样式表，包含了图标的样式定义和对字体文件的引用。
- iconfont.eot：字体文件，用于支持IE6-8。
- iconfont.svg：字体文件，用于Safari和iOS设备。
- iconfont.ttf：字体文件，用于支持IE9+。
二、转换ttf文件在小程序的开发中，我们需要使用iconfont.ttf文件来引用图标。但是，小程序的wxss文件中的font-face的url不接受 {
font-family: 'iconfont';
src: url('data:application/x-font-ttf;charset=utf-8;base64,xxxxxx') format('truetype');
}
```
其中，xxxxxx是转换后的base64格式的ttf文件内容。通过以上步骤，就可以在小程序中使用iconfont提供的图标了。
三、在小程序中使用icon在小程序的wxml文件中，可以通过
```html
```
其中，class属性指定了使用的字体图标样式表，type属性指定了具体的图标名称。
在对应的wxss文件中，可以定义iconfont类，以及具体图标的样式。例如：
```css.iconfont {
font-family: 'iconfont' !important;
font-size:20rpx !important;
color: 333;
}
```
通过以上步骤，就可以在小程序中使用icon了，可以根据具体的需求，更改图标的样式和布局，使得页面更加丰富多彩。
