修改|新增jquery-easyui icon图标

by:授客 QQ:1033553122

测试环境

jquery-easyui-1.5.3

修改配置文件

打开jquery-easyui-1.5.3\themes\icon.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图标的更多相关文章

  1. EasyUI中使用自定义的icon图标

    我们在web开发中为了界面的更加漂亮,我们可能会使用EasyUI框架来帮我们实现一些好看的效果,那么在框架里面提供了很多的样式和图标,但是有时候自带的图标已经满足不了我们啦,这时候我们应该往里面加入我 ...

  2. 第 1 章 jQuery EasyUI 入门

    学习要点: 1.什么是 jQuery EasyUI 2.学习 jQuery EasyUI 的条件 3.jQuery EasyUI 的功能和优势 4.其他的 UI 插件 5.是否兼容低版本 IE 6.下 ...

  3. jQuery EasyUI DataGrid Checkbox 数据设定与取值

    纯粹做个记录,以免日后忘记该怎么设定. 这一篇将会说明两种使用 jQuery EasyUI DataGrid 的 Checkbox 设定方式,以及在既有数据下将 checked 为 true 的该笔数 ...

  4. jQuery EasyUI 入门简介

    对于前端开发者来说,在开发过程中应用“框架”这一工具,可以极大的缩短开发时间,提高开发效率.今天我们就开介绍一款常用的框架——jQuery EasyUI. 那什么是jQuery EasyUI呢? jQ ...

  5. jQuery EasyUI的各历史版本和应用

    from:http://blog.sina.com.cn/s/blog_b8be6dc40102xpe6.html 各历史版本下载地址: http://www.jeasyui.com/download ...

  6. bootstrap在input框中加入icon图标

    <form class="form-horizontal"> <div class="form-group has-feedback"> ...

  7. 基于JQuery easyui,gson的批量新增/修改和删除-servlet版

    最近项目需要用到在页面进行批量操作,做了一些这方面的学习,参照网上的资料写了个小例子,记录一下: 准备 引入gson-2.6.2.jar,这里使用gson而不使用json-lib,原因是json-li ...

  8. Jquery EasyUI的添加,修改,删除,查询等基本操作介绍

    http://www.jb51.net/article/42016.htm 初识Jquery EasyUI看了一些博主用其开发出来的项目,页面很炫,感觉功能挺强大,效果也挺不错,最近一直想系统学习一套 ...

  9. jquery easyui添加图标扩展

    easyui中有很多通过iconCls="icon-reload"这样的属性引入小图标显示,当然我们也可以自己添加自己的小图标. 方式:1.我们可以在jquery easyui的文 ...

随机推荐

  1. 【RL-TCPnet网络教程】第16章 UDP用户数据报协议基础知识

    第16章      UDP用户数据报协议基础知识 本章节为大家讲解UDP(User Datagram Protocol,用户数据报协议),需要大家对UDP有个基础的认识,方便后面章节UDP实战操作. ...

  2. 原来Java世界里也有这么多精彩的故事,学Java真有趣!

    大千世界,无所不有.这世上不光有人类世界,还有咱们的java世界.今天就由我这个实习导游带领你们了解了解咱们的java世界奇妙之处.   有一种暖男叫catch,有一种真爱叫try---catch,世 ...

  3. 阿里面试题,深入理解Java类加载机制

    类的生命周期 包括以下 7 个阶段: 加载(Loading) 验证(Verification) 准备(Preparation) 解析(Resolution) 初始化(Initialization) 使 ...

  4. Android OpenSL ES 开发:OpenSL ES利用SoundTouch实现PCM音频的变速和变调

    缘由 OpenSL ES 学习到现在已经知道 OpenSL ES 不仅能播放和录制PCM音频数据,还能改变声音大小.设置左声道或右声道播放.还能变速播放,可谓是播放音频的王者.但是变速有一点不好的就是 ...

  5. [Swift]LeetCode101. 对称二叉树 | Symmetric Tree

    Given a binary tree, check whether it is a mirror of itself (ie, symmetric around its center). For e ...

  6. java.lang.AbstractMethodError: org.mybatis.spring.transaction.SpringManagedTransaction.getTimeout()Ljava/lang/Integer; 报错解决

    我的妈呀  真的是各种报错..... 这个问题    解决方法: https://www.cnblogs.com/beppezhang/p/6118661.html

  7. 解决classNotFound的问题的思路

    用Ctrl+Shift+t可以查看class,对于报错信息,我们把没有找到的class放到查找框里进行查看,找到之后把这个jar包放到WEB-INF的lib目录下,build path一下就可以了. ...

  8. pytorch学习:准备自己的图片数据

    图片数据一般有两种情况: 1.所有图片放在一个文件夹内,另外有一个txt文件显示标签. 2.不同类别的图片放在不同的文件夹内,文件夹就是图片的类别. 针对这两种不同的情况,数据集的准备也不相同,第一种 ...

  9. How does the vuejs add the query and walk the object?

    让这个老实返回的页面添加特殊路由,这个页面常常都是登录注册.这次我们根据登录举例. 省略 { path:'/login?url=:url', name:'loginfirst', component: ...

  10. Qt之自定义托盘(二)

    上一篇文章讲述了自定义Qt托盘,不过不是使用QSystemTrayIcon这个类,而是我们自己完全自定义的一个类,我们只需要处理这个类的鼠标hover.鼠标左键点击.鼠标右键点击和鼠标左键双击,就可以 ...