The use of iconfont vector icons in small programs

Introduction

I am learning about applet development recently. Do I need to use some icons? Iconfont is a vector icon library with some practical and beautiful icon settings. Click on the relevant link to enter . It is best to log in. Here you can use your mobile phone number, github, WeChat Bo and other accounts to log in After logging

in:

Search for the icon you want and click add to cart above

Then click on the shopping cart icon and a page will appear

You can click to add to the project, of course, you can also download the material or code, here I choose to add to the project

Then click Generate Code

Copy the following content into the applet project. The specific creation process is as follows:

1 Create a style folder in the applet project directory -> create iconfont.wxss file

2 Directly copy the content in the above page -> iconfont.wxss file

3 Perform global configuration in app.wxss and add it to the statement: @import './styles/iconfont.wxss'

4 Introduce in the applet .wxml file, note that the iconfont class must be written, because it is a prerequisite for using the icon. Such as

<view class='test iconfont icon-home'>test</view>

If nothing else, the corresponding icon will appear