[EasyUI美化换肤]更换EasyUi图标
本篇文章主要是记录一些换EasyUI皮肤的过程,备忘.也欢迎美工大神各路UI给点好意见,EasyUI我就不介绍了,自行百度吧..(So..所以别问我是不是响应式..本身EasyUI就不是响应式..我换个皮肤..就更不谈..)
其实重点看需求,我们主要做的后台项目对手机Web几乎没要求,所以,暂不考虑
上几张效果图先:
整体布局
树形菜单:
菜单列表:
改了之后还是可以的(毕竟我也不是专业的美工,我就是个.NET的开发..没办法..被逼的..)..
其实我们引用EasyUI的时候就可以发现,除了要引用easyui.css还要加一个icon.css,这里面就是EasyUI的图标了,我们看看里面如图:
里面都是一些.icon开头的样式,对应的都是一些background地址,这里我们就有两种换的方案
第一种简单无脑版:重做这些图片大小一致 图片换掉..
第二种高端大气无后患版:找到新的图标替代
我反正..选择了第二种..,我们选择Font-awesome3.2,这个图标集来替换,
为什么选择这个呢
1.他的3.2版本CSS开头也是.icon(4.0+版本换成了fa)方便我们替换
2.图标够多..完全够用
我们直接打开Font-awesome提供的CSS样式.
将EasyUI的样式复制到Font-awesome的最下面.
然后把其中的背景图样式全部删除.
这里替换一个作为范例:
EasyUI中有一个叫.icon-add,我们发现图标是一个加号
我们在Font-awesome官网找到这个加号对应的样式名称: icon-plus
然后在Font-awesome的CSS中搜索到他对应的context是:\f055
我们就在改.icon-add为如下代码:
.icon-add:before{
content: "\f055";
}
这样我们就完成了一个图标的替换
后面的只要一一按照这个方法,就替换完成了~
[EasyUI美化换肤]更换EasyUi图标的更多相关文章
- C# Winform中窗体的美化—— 用IrisSkin轻松实现换肤功能
今天经前辈提醒才知道winform窗体还有美化工具,呵呵,不得不说,孤陋寡闻了.下面总结一下irisskin2的使用步骤和遇到的问题及解决办法. 1.网址:http://www.pc6.com/sof ...
- easyui中tree控件添加自定义图标icon
来源于:http://blog.163.com/lintianhuanhai@126/blog/static/165587366201421704420256/ <!DOCTYPE html&g ...
- Android可更换布局的换肤方案
换肤,顾名思义,就是对应用中的视觉元素进行更新,呈现新的显示效果.一般来说,换肤的时候只是更新UI上使用的资源,如颜色,图片,字体等等.本文介绍一种笔者自己使用的基于布局的Android换肤方案,不仅 ...
- C# WinForm界面美化--使用IrisSkin实现换肤功能
WinForm界面使用IrisSkin,可以说做到了一键美化,当然美化的效果仁者见仁智者见智,可以挑选自己喜欢的. 1.IrisSkin下载地址:https://www.cr173.com/soft/ ...
- 使用 css/less 动态更换主题色(换肤功能)
前言 说起换肤功能,前端肯定不陌生,其实就是颜色值的更换,实现方式有很多,也各有优缺点 一.看需求是什么 一般来说换肤的需求分为两种: 1. 一种是几种可供选择的颜色/主题样式,进行选择切换,这种可供 ...
- 【转】【iOS】动态更换App图标
原文网址:http://www.cocoachina.com/ios/20170619/19557.html 前言 动态更换App图标这件事,在用户里总是存在需求的:有些用户喜欢“美化”自己的手机.至 ...
- VS中基于对话框的MFC利用换肤改变边框颜色及格式
第一版本: http://ishare.iask.sina.com.cn/f/13836420.html?from=like 2. http://www.cnblogs.com/phinecos/ar ...
- hybird之web动态换肤实现
前言 最近在重构个hybird(原生的壳包着Web页面)的UI框架,进行到了做换肤功能的阶段,所以这里是我思考的解决的方法. 预想 目前实现换肤的功能无非就两种做法. 1.写几个皮肤文件,然后切换使用 ...
- 利用CSS预处理技术实现项目换肤功能(less css + asp.net mvc4.0 bundle)
一.背景 在越来越重视用户体验的今天,换肤功能也慢慢被重视起来.一个web系统用户可以选择一个自己喜欢的系统主题,在用户眼里还是会多少加点分的.我们很开心的是easyui v1.3.4有自带defau ...
随机推荐
- Java 8五大主要功能为开发者提供了哪些便利?
两年前当Java 8发布后,立即受到了业界的欢迎,因为它大大提高了Java的性能.它独特的卖点是,顾及了编程语言的每一个方面,包括JVM(Java虚拟机)和编译器,并且改良了其它帮助系统. Java是 ...
- lua执行字节码的过程介绍
前面一篇文章中介绍了lua给下面代码生成最终的字节码的整个过程,这次我们来看看lua vm执行这些字节码的过程. foo = "bar" local a, b = "a& ...
- MAVEN学习-第一个Maven项目的构建
MAVEN安装成功之后就可以进行项目的构建和管理了: 为什么要用maven进行项目的构建和管理? 对于初学者来说一个最直接的也是最容易里的优点在于JAR包的管理,相对于以前开发一个项目的时候我们需要用 ...
- 如何利用ansible callback插件对执行结果进行解析
最近在写一个批量巡检工具,利用ansible将脚本推到各个机器上执行,然后将执行的结果以json格式返回来. 如下所示: # ansible node2 -m script -a /root/pyth ...
- [开发笔记] Graph Databases on developing
TimeWall is a graph databases github It be used to apply mathematic model and social network with gr ...
- 通过AngularJS实现前端与后台的数据对接(一)——预备工作篇
最近,笔者在做一个项目:使用AngularJS,从而实现前端与后台的数据对接.笔者这是第一次做前端与后台的数据对接的工作,因此遇到了许多问题.笔者在这些问题中,总结了一些如何实现前端与后台的数据对接的 ...
- Java定时任务的常用实现
Java的定时任务有以下几种常用的实现方式: 1)Timer 2)ScheduledThreadPoolExecutor 3)Spring中集成Cron Quartz 接下来依次介绍这几类具体实现的方 ...
- C# 对象实例化 用json保存 泛型类 可以很方便的保存程序设置
参考页面: http://www.yuanjiaocheng.net/webapi/test-webapi.html http://www.yuanjiaocheng.net/webapi/web-a ...
- PAT甲级 1001. A+B Format (20)
题目原文: Calculate a + b and output the sum in standard format -- that is, the digits must be separated ...
- iOS在导航栏上居中显示分段控件(UISegmentedControl)
UISegmentedControl *segmentedControl = [[UISegmentedControl alloc] initWithItems:nil]; segmentedCont ...