打开iconfont阿里官网

​iconfont阿里图标地址​

  • 用gitlub账户登录即可

找到心仪的图标加入到自己的项目中

  1. 添加入库
  2. ionic3 引入iconfont_css

2.点击购物车

ionic3 引入iconfont_css_02


3.添加到项目

ionic3 引入iconfont_app_03


ionic3 引入iconfont_app_04


4.选择下载到本地

ionic3 引入iconfont_css_05


5.讲下载的下面5个文件拷贝到ionic3的项目中的 assets目录下 新建fonts文件夹中,将原来的iconfont.css 修改扩展名为iconfont.scss

ionic3 引入iconfont_ico_06


6.引入到app.scss中

ionic3 引入iconfont_app_07


7.微调iconfont.scss,改成一个地方将iconfont的ont-family: “iconfont”;修改成font-family: “Ionicons”;

ionic3 引入iconfont_ico_08

ionic3 引入iconfont_ionic3_09


8. 程序中引用

ionic3 引入iconfont_git_10


ionic3中这样引用

ionic3 引入iconfont_git_11

9.效果

ionic3 引入iconfont_ionic3_12


自此,大功告成,最喜欢的一句话!!!