iconfont - 阿里巴巴矢量图标库如何在项目中使用(vue/react/angular)

3,096 阅读1分钟

1> 点击新建项目 【名称】

2>下载至本地 , 将下载的文件解压,将里面的所有文件复制到项目的assets目录下的iconfont文件夹中。如下图

3>在根html文件中,按照你的目录结构引入assets/iconfont/iconfont.css文件

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

4>到现在已经配置好了,可以愉快玩耍了QAQ

5>使用起来很简单,直接在项目里的任何html中使用下面语句 【iconfont固定写法,后面的class名称为阿里巴巴图标库里的项目的图标名称】

<span class="iconfont shangchuan"></span>

不仅可以使用class方式使用阿里图标库,还可以unicode及symbol方式使用,具体方法可以参考你项目文件夹下面的assets/iconfont/demo.html里的使用步骤!!!

  • 用法很简单 ,使用很方便,如果觉得有任何疑问的或者讲的不好的地方可以给我留言或者评论,谢谢大家!!! 共同进步

兄弟姐妹们,点波关注吧,一起分享有趣的技术!

掘金juejin.cn/user/303430… 全部原创好文

CSDNblog.csdn.net/qq_42753705… 全部原创好文

segmentfault 思否segmentfault.com/u/jasonma19… 全部原创好文