阿里云icon图标_免费icon素材图标推荐

阿里云icon图标_免费icon素材图标推荐,第1张

阿里云icon图标_免费icon素材图标推荐 Element UI 是目前流行的一款前端UI工具。

它能配合Vue这个流行的前端框架。

安装使用也简单:npm i element-ui -S即可。

不过美中不足的是自带的图标集合不够用,图标太少了。

今天刚好碰到这个问题,现在来分享一下如何在Vue Element中使用阿里云矢量图标库。

element 自带图标库一,注册阿里云图标库Iconfont,过程自行百度。

二,创建项目三,添加图标到项目:首先在首页搜索需要的图标,然后添加到购物车,接着添加到指定的项目四,下载图标文件五,将文件解压,复制到Vue项目:我是在Vue项目的src-assets下创建了icon文件夹,将所有的文件复制了过来六,修改其中的iconfont.css文件:这里以引用icon-shouye图标为例七,复制阿里云图标库中的所选图标的代码八,重新编译Vue项目:npm run dev九,引用图标:这里以我的el-button为例:<el-button icon=”icon-shouye” size=”small” circle style=”background:#abd3ff”></el-button></div>对比,这个小房子的图标是阿里云图标库的,在element自带的图标库并没有,至此,引用成功。

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/tougao/650344.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-04-17
下一篇 2022-04-17

发表评论

登录后才能评论

评论列表(0条)

保存