Ionic - 图标 iconfont的使用（阿里图标库）

iconfont在ionic中的使用：

1.进入iconfont官方网址后

2.搜索你想要的图标，添加到购物车（前提：是已经登录，这里可以使用github注册登录）

3.点击购物车创建项目并下载到本地

4.下载之后的文件

5，在index.html引入

 

1. <!-- 引入iconfont的css -->

2. <link rel="stylesheet" href="assets/font/iconfont.css">

6.在页面这样显示<i class="iconfont  icon-music"></i>(icon-music是图标的名称)

在iconfont.css里面查看（也可以在这个文件里设置想要的颜色，设置大小）

 

1. <ion-grid>

2. <!-- wrap：用来换行 -->

3. <ion-row wrap>

4. <ion-col text-center tappable col-3 *ngFor="let music of musicCate" >

5. <i class="iconfont {{music.icon}}"></i><br>

6. <span class="title">{{music.name}}</span>

7. </ion-col>

8. </ion-row>

9. </ion-grid>

这里是我项目中取出图片的方式，

页面展示：