layui图标无法正常显示(乱码())

 

一、问题描述:

layui图标样式,包括富文本图标忽然都不显示,数据依然正常,按钮功能也好使

layui图标无法正常显示(乱码())

 

二、原因分析

字体图标不正常显示是layui的标签

<i class="layui-icon layui-icon-triangle-r"></i>

或者font文件夹的原因。

三、问题解决(本人第四种方案)

方案1:项目初建的情况,忘记引入font文件夹

layui图标无法正常显示(乱码())

方案2:js和css/font不在同一个文件夹下

layui图标无法正常显示(乱码())

方案3:使用layui-icon时出现了默认图标问题(网路截图)

layui图标无法正常显示(乱码())

方案4:原因:经过maven的filter,会破坏font文件的二进制文件格式,导致前台解析出错。

layui图标无法正常显示(乱码())

在html文件使用字体图标并且预览时正常,但是启动工程后显示不正常,浏览器调试界面显示字体文件无法decode:

Failed to decode downloaded font: xxxx

原因:经过maven的filter,会破坏font文件的二进制文件格式,导致前台解析出错。