Vue中使用ElementUI使用第三方图标库iconfont的示例


Posted in Javascript onOctober 11, 2018

1.在/resources/imgs/img_not_found.png//www.iconfont.cn/阿里巴巴图标库添加图标到自己项目中,然后点击更多项目中的编辑项目

Vue中使用ElementUI使用第三方图标库iconfont的示例

2.修改前缀为el-icon-xxx,xxx自定义,然后将项目下载自本地

Vue中使用ElementUI使用第三方图标库iconfont的示例Vue中使用ElementUI使用第三方图标库iconfont的示例

3.将这5个文件放入到项目文件中,将iconfont.css引入到Vue项目中,

然后修改iconfont.css的.iconfont处,将其修改为下图所示

Vue中使用ElementUI使用第三方图标库iconfont的示例

4.修改iconfont.css后,大致如下图所示

Vue中使用ElementUI使用第三方图标库iconfont的示例

5.最后就可以采用icon相同方式引入图标,如下图方式引用即可

Vue中使用ElementUI使用第三方图标库iconfont的示例

注意:如果修改前缀为el-icon引入,可能会导致与element-ui的icon冲突导致显示异常。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
Hutia 的 JS 代码集
Oct 24 Javascript
一个基于jquery的图片切换效果
Jul 06 Javascript
关于jQuery判断元素是否存在的问题示例探讨
Jul 21 Javascript
node.js中的fs.closeSync方法使用说明
Dec 17 Javascript
js获取表格的行数和列数的方法
Oct 23 Javascript
jquery做个日期选择适用于手机端示例
Jan 10 Javascript
JS基于for语句编写的九九乘法表示例
Jan 04 Javascript
详解Vue CLI3配置解析之css.extract
Sep 14 Javascript
JS内置对象和Math对象知识点详解
Apr 03 Javascript
浅析JavaScript 函数防抖和节流
Jul 13 Javascript
vue使用element-ui实现表单验证
Dec 13 Vue.js
three.js 实现露珠滴落动画效果的示例代码
Mar 01 Javascript
css配合JavaScript实现tab标签切换效果
Oct 11 #Javascript
vue最简单的前后端交互示例详解
Oct 11 #Javascript
JavaScript中七种流行的开源机器学习框架
Oct 11 #Javascript
用Object.prototype.toString.call(obj)检测对象类型原因分析
Oct 11 #Javascript
使用vue 国际化i18n 实现多实现语言切换功能
Oct 11 #Javascript
详解Angular5/Angular6项目如何添加热更新(HMR)功能
Oct 10 #Javascript
Node.js npm命令运行node.js脚本的方法
Oct 10 #Javascript
You might like
php录入页面中动态从数据库中提取数据的实现
2006/10/09 PHP
用PHP实现多服务器共享SESSION数据的方法
2007/03/16 PHP
PHP限制页面只能在微信自带浏览器访问的代码
2014/01/15 PHP
PHPAnalysis中文分词类详解
2014/06/13 PHP
为PHP安装imagick时出现Cannot locate header file MagickWand.h错误的解决方法
2014/11/03 PHP
求数组最大最小值方法适用于任何数组
2013/08/16 Javascript
jQuery中[attribute]选择器用法实例
2014/12/31 Javascript
Backbone.js 0.9.2 源码注释中文翻译版
2015/06/25 Javascript
jQuery往textarea中光标所在位置插入文本的方法
2015/06/26 Javascript
深入探讨前端框架react
2015/12/09 Javascript
Angularjs中的页面访问权限怎么设置
2016/11/11 Javascript
js实现交通灯效果
2017/01/13 Javascript
Express与NodeJs创建服务器的两种方法
2017/02/06 NodeJs
Vue自定义指令封装节流函数的方法示例
2018/07/09 Javascript
vue+axios 前端实现的常用拦截的代码示例
2018/08/23 Javascript
vue实现动态按钮功能
2019/05/13 Javascript
vue2.0实现列表数据增加和删除
2020/06/17 Javascript
[02:16]DOTA2超级联赛专访Burning 逆袭需要抓住机会
2013/06/24 DOTA
[43:14]Liquid vs Optic 2018国际邀请赛淘汰赛BO3 第二场 8.21
2018/08/22 DOTA
利用Python爬虫给孩子起个好名字
2017/02/14 Python
Pandas过滤dataframe中包含特定字符串的数据方法
2018/11/07 Python
安装docker-compose的两种最简方法
2019/07/30 Python
python读取图片颜色值并生成excel像素画的方法实例
2021/02/19 Python
用pip给python安装matplotlib库的详细教程
2021/02/24 Python
Fanatics英国官网:美国体育电商
2018/11/06 全球购物
Why do we need Unit test
2013/01/03 面试题
宿舍使用违章电器检讨书
2014/01/12 职场文书
人力资源部经理助理岗位职责
2014/03/04 职场文书
竞选劳动委员演讲稿
2014/04/28 职场文书
群众路线教育实践活动的心得体会
2014/09/03 职场文书
教师个人考察材料
2014/12/16 职场文书
银行自荐信范文
2015/03/25 职场文书
何玥事迹观后感
2015/06/16 职场文书
2016暑期师德培训心得体会
2016/01/09 职场文书
简历中的自我评价怎么写呢?
2019/04/30 职场文书
Mysql 一主多从的部署
2022/05/20 MySQL