Easyui 修改|新增jquery-easyui icon图标

Posted shouke

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了Easyui 修改|新增jquery-easyui icon图标相关的知识,希望对你有一定的参考价值。

修改|新增jquery-easyui icon图标

by:授客 QQ:1033553122

 

测试环境

jquery-easyui-1.5.3

 

修改配置文件

打开jquery-easyui-1.5.3 hemesicon.css文件,文件头部添加目标图标样式,例子:

.icon{

background:url(‘../../icons/tabicons.png‘) no-repeat;

width:18px;

height:18px;

display:inline-block;

}

.icon-set{

background-position:-380px -200px;

}

 

.icon-sys-set{

background-position:0px -220px;

}

 

.icon-person{

background-position:-200px -480px;

}

以上举例从大图中“抠取”小图标,如果是取整张图片作为小图标,可以如下

.icon-person{

background:url(‘../../icons/icon-person.png‘) no-repeat;

}

 

这里演示的是添加,也可以对原有的进行修改

注意:css样式存在优先级,之所以把自己添加的样式放文件最开头是为了避免覆盖框架自带的

 

引用图标

<span class="icon icon-sys-set">     </span>

 

以上是关于Easyui 修改|新增jquery-easyui icon图标的主要内容,如果未能解决你的问题,请参考以下文章

Jquery-EasyUI

jQuery-EasyUI

JQuery-Easyui----Resizable( 调整大小) 组件

Jquery-easyui工具easyuiUtils

jQuery-EasyUI:Layout

快递物流管理系统(SSM,JQUERY-EASYUI,MYSQL)