阿里图标官网:http://www.iconfont.cn/
一,单色图标的使用
1,选择你需要的图标添加到购物车,
2,进入到购物车页面,选择添加到项目按钮
3,进入我的项目页面,下载至本地,解压出来把iconfont.css中修改@font-face中的代码为在线生成的Unicode,如果是小程序中使用注意改成WXss格式
4,在html中使用<text class='iconfont icon-shouye4'></text> 此text是小程序中的很累标签
<text class='f20 iconfont icon-shouye4'>我的患者</text>
f20是自定义的字体大小样式,iconfont 不变,变后边的
二,多色图标的使用
前三步同单色图标使用的前三步,
4,页面引入下载过来的iconfont.js
<script src="iconfont.js"></script>
5,在css中加入样式:
.icon {
width: 1em; height: 1em;
vertical-align: -0.15em;
fill: currentColor;
overflow: hidden;
}
6,在html中使用
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-time"></use>
</svg>
其中 xlink:href="#icon-time"的icon-time就是该图标的class类名
获取类名如下图