首先登录https://www.iconfont.cn/找到你要的图标
在这里点 查看在线链接并复制代码
![](https://img.haomeiwen.com/i16812888/d27e59373c0e05c6.png)
在项目中新建根目录下新建 iconfont.wxss(如果你想用其他的文件名,我保证不打死你) 把代码贴进去
在这里点 font class
![](https://img.haomeiwen.com/i16812888/4196147e0f19f6a0.png)
点下载到本地
解压下载的文件
![](https://img.haomeiwen.com/i16812888/ba5223ac8ed6e099.png)
打开红框中的文件,拷贝蓝框的内容添加到iconfont.wxss
最终你的iconfont.wxss应该像这样的:
![](https://img.haomeiwen.com/i16812888/14a4bbb639e58df9.png)
在app.wxss中第一行 @import 'iconfont.wxss';
然后就可以在小程序中愉快地使用iconfont了
在项目中添加 iview-weapp 参考官网
https://weapp.iviewui.com/docs/guide/start
几种使用方法:
方法1直接使用class:
<view class=" iconfont xxx "> </view>
或者可以这样
<i-icon class=" iconfont xxx "/>
方法2使用i-class:
<i-icon i-class=" iconfont xxx "/>
方法3直接使用type:
在 ../../dist/icon/index.wxss第一行添加
@import '../../iconfont.wxss';
然后你就可以这样用了,就像iview-weapp自带的一样
<i-icon type=" iconfont xxx "/>
网友评论