EasyUI 中自定义组件 icon 图标

EasyUI 中自定义组件 icon 图标

EasyUI 中自带的 icon 图标：

EasyUI 自带的 icon 就 二十多个，大多数情况下都不够用，需要自定义icon图标才能满足需求。

今天将自定义的方法记录一下，积累起来：

步骤一：上网找到合适的图标下载下来；

推荐一个免费的图库：https://www.easyicon.cc/（下载16*16的png图标 , 示例：data.png）

步骤二：

复制到easyui文件夹下的themes文件夹的icons文件夹里

步骤三：

在themes文件夹下找到icon.css，添加以下语句：

.icon-data{
	background:url('icons/data.png') no-repeat center center;
}

接着去浏览器测试就可以了……

其实还真的遇到了问题：图标在IE浏览器中可以正常显示，在谷歌无法正常显示。

解决：

1、首先查看了路径，上上下下的配置也检查了一遍，发现没有什么问题；

2、通过google浏览器的元素审查发现，在icon.css中新定义的样式没有被加载，原因是缓存造成的，清除缓存就行了！

（按F12或右上角点开--更多工具--开发者工具）