修改|新增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. rem布局完成响应式开发,通俗且详细的原理解析和代码实现

    一.rem布局基本原理 原理:rem可以理解为一个长度单位,单位rem的值等于网页font-size的值.如果网页的字体大小为默认值16px,那么1rem就等于16px,0.5rem等于8px. 根据 ...

  2. MySQL 数据库在 Windows 下修复 only_full_group_by 的错误

    本机上新安装了个MySQL数据库,在插入数据的时候一直提示这个错误: [Err] 1055 - Expression #1 of ORDER BY clause is not in GROUP BY ...

  3. [Swift]LeetCode720. 词典中最长的单词 | Longest Word in Dictionary

    Given a list of strings words representing an English Dictionary, find the longest word in words tha ...

  4. [Swift]LeetCode741. 摘樱桃 | Cherry Pickup

    In a N x N grid representing a field of cherries, each cell is one of three possible integers. 0 mea ...

  5. Python - Python2与Python3的区别、转换与兼容

    区别 Python2.x与Python3.x版本区别:http://www.runoob.com/python/python-2x-3x.html 示例解读Python2和Python3之间的主要差异 ...

  6. markdown反射型xss漏洞复现

    markdown xss漏洞复现 转载至橘子师傅:https://blog.orange.tw/2019/03/a-wormable-xss-on-hackmd.html 漏洞成因 最初是看到Hack ...

  7. Python内置函数(63)——super

    英文文档: super([type[, object-or-type]]) Return a proxy object that delegates method calls to a parent ...

  8. ElasticSearch(1)---Mysql同步数据到ElSearch

    ElasticSearch同步Mysql 先讲项目需求:对于资讯模块添加搜索功能 这个搜索功能我就是采用ElasticSearch实现的,功能刚实现完,所以写这篇博客做个记录,让自己在记录下整个步骤和 ...

  9. SpringCloud系列十二:SpringCloudSleuth(SpringCloudSleuth 简介、SpringCloudSleuth 基本配置、数据采集)

    声明:本文来源于MLDN培训视频的课堂笔记,写在这里只是为了方便查阅. 1.概念:SpringCloudSleuth 2.具体内容 Sleuth 是一种提供的跟踪服务,也就是说利用 sleuth 技术 ...

  10. [SQL]SQL 执行顺序

    这个文章主要是防止我忘了 SQL 的执行顺序,解释的东西我都没怎么看懂.数据库渣如我- 逻辑查询处理阶段简介 FROM:对FROM子句中的前两个表执行笛卡尔积(Cartesian product)(交 ...