1,打开阿里巴巴矢量图标库
http://www.iconfont.cn/collections/index?spm=a313x.7781069.1998910419.da2e3581b&type=1
2,选择需要的图标加入购物车;
3,将购物车中的图标加入本地项目;
第一种方法:
(1)获取在线链接,将获取到的在线链接复制到编辑器css文件;
(2)<i class="iconfont">unicode<i/><i class="iconfont"></i>
第二种方法:
(1)点击暂存架的下载至本地,解压待用;
(2)打开下载包中的demo.html,按照demo的步骤,配置ionic的项目;
(3)静态文件存放目录,新建font文件夹用来存放字体文件(可自定义存放);
(4)css使用font-face声明字体;
(5)css定义使用iconfont的样式;
(6)挑选相应图标并获取字体编码,应用于页面就可以显示图标啦
第三种方法:
(1)同第二种方法,只是使用方法不同
(2)Ionic的图标只要加个类似ion-happy ion-XXX的class就可以应用相应的图标;
(3)将那些.icon-XXX:before{content:‘XXXX‘}也复制到你的css文件中去
(4)只要在class中加 iconfont icon-XXX就可以使用图标了;
时间: 2024-12-21 04:42:41