美文网首页前端开发那些事儿
如何使用iconfont扩展自定义uView图标库

如何使用iconfont扩展自定义uView图标库

作者: 周星星的学习笔记 | 来源:发表于2021-06-21 19:15 被阅读0次

一、在iconfont上的「资源管理」-「我的项目」模块上传自定义的图标

图标管理

二、切换到「font class」TAB,然后点击「下载至本地」

三、解压之后,将如下的四个文件放到工程目录中

  • iconfont.css
  • iconfont.ttf
  • iconfont.woff
  • iconfont.woff2
文件

四、修改iconfont.css文件

iconfont.css

五、在App.vue文件中导入iconfont.css

<style lang="scss">
@import "./common/style/common.scss";
...
</style>

六、使用

<u-icon name="paihangbang" custom-prefix="custom-icon" size="30" color="#888888"></u-icon>

七、参考(参考原文做的过程中,有一些地方不同)

参考来源

相关文章

网友评论

    本文标题:如何使用iconfont扩展自定义uView图标库

    本文链接:https://www.haomeiwen.com/subject/kmyzeltx.html