首页 > 编程知识 正文

vue使用阿里标库,阿里巴巴标矢量库怎么用

时间:2023-05-05 02:09:04 阅读:233299 作者:4356

添加图标并下载 一、点击图标管理–>我的项目,创建项目


简单点~填个项目名即可

二、选择一个图标,加入购物车

点击右上角购物车的图标,添加至项目(可以直接点击下载代码,不需要创建项目,但是如果是项目有很多图标,需要后续管理,还是要创建项目),然后回到第一步中的我的项目,点击下载至本地

在vue项目中使用 一、引入项目

解压缩下载好的项目,复制到项目中(我的目录是src/assets/iconfont,删除demo开头的文件)

二、在main.js引入 ...import Vue from "vue";import App from "./App.vue";import "./assets/iconfont/iconfont.css"; //引入阿里巴巴矢量图标库... 三、代码中使用

iconfont.css

//icon名称在下载的文件夹中的iconfont.css中.iconfont { font-family:"iconfont" !important; font-size:16px; font-style:normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;}.icon-denglu:before { content: "e611"; }

使用

<i class="iconfont icon-denglu"></i>

版权声明:该文观点仅代表作者本人。处理文章:请发送邮件至 三1五14八八95#扣扣.com 举报,一经查实,本站将立刻删除。