使用Element UI组件时,icon图标不显示

问题描述:

我在使用Element UI组件的日期选择器时,发现图标不显示(左边是原图,右边的问题图)。

经过检查我发现,我的JS,CSS文件都没有问题,只是缺少了element-icons.tff和element-icons.woff这两个文件。

如果你也是icon图标不显示,你可以用这个方法重新替换这两个文件,或者去将CSS和JS的版本号更新到最新。

解决方法:

  1. 直接去官网,看他的CDN中给出的CSS链接。
  1. 复制后面"https://unpkg.com/element-ui/lib/theme-chalk/"这个链接。
  1. 右上角是版本号,左下角是有关图标的文件夹。根据你的版本号,进入fonts这个文件,你会发现有两个文件。
  1. 点击第一个element-icons.tff文件,再点击 View Raw按钮下载这个文件。

同理,也下载element-icons.woff文件。

  1. 最后,将这两个文件放在css文件夹下的fonts文件下。
相关推荐
UI设计和前端开发从业者4 小时前
UI前端大数据处理策略优化:基于云计算的数据存储与计算
前端·ui·云计算
共享ui设计和前端开发人才1 天前
UI前端大数据处理安全性保障:数据加密与隐私保护策略
ui
ui设计前端开发老司机1 天前
UI前端大数据处理性能瓶颈突破:分布式计算框架的应用
ui
前端开发与ui设计的老司机1 天前
UI前端与数字孪生结合实践探索:智慧物流的货物追踪与配送优化
前端·ui
UI设计和前端开发从业者1 天前
从UI设计到数字孪生实战应用:构建智慧金融的智能风控平台
ui·金融
ui设计前端开发老司机1 天前
数字孪生技术为UI前端提供全面支持:实现产品的可视化配置与定制
ui
X_StarX2 天前
【Unity笔记01】基于单例模式的简单UI框架
笔记·ui·unity·单例模式·游戏引擎·游戏开发·大学生
Clair-Sean2 天前
【交互设计】UI 与 UX 简介:从核心概念到行业实践
ui·ux
Zevalin爱灰灰2 天前
MATLAB GUI界面设计 第六章——常用库中的其它组件
开发语言·ui·matlab
前端开发与ui设计的老司机2 天前
数字孪生技术引领UI前端设计潮流:增强现实(AR)的集成应用
ui