jquery ui的css设计二
上一篇见这里
本篇重点说一下其换肤功能
换肤一般是指改变控件的字体颜色,背景颜色,边框颜色,hover上去的颜色,背景图片,很少再会涉及修改其长宽,字体类型什么的。
以这个版本的CSS为观察对象,可以发现,它从上到下分为
- Layout helpers 以ui-helper-开头,表示某种功能
- Interaction Cues 交互 只有一个.ui-state-disabled
- Icons 装饰用 只有ui-icon, 它与ui-icon-*配合使用
- Misc visuals 具体的每个组件,以ui- uiname开头
- Component containers 每个组件都有的部分 与换肤有关,主要有这三个类名:
.ui-widget .ui-widget-content .ui-widget-header - Interaction states各种ui-state-*, 如.ui-state-default, .ui-state-hover, .ui-state-focus, .ui-state-active 与点击,掠过,选中等行为有关
- Interaction Cues 也是各种ui-state-*, 如.ui-state-highlight, .ui-state-error ,.ui-priority-primary, .ui-priority-secondary, .ui-state-disabled 多 表示按钮的状态,如正常,警告,报错, 成功
- Icons 各种图标的具体定义
- Corner radius 圆角
- Overlays 遮罩层 (这个也与皮肤有关)
jquery ui官网有下面这样一个工具,我们可以一下把其中的变量扒出来

http://hi.baidu.com/ivugogo/item/605795f7a5c27a1ea62988e4
jquery ui的css设计二的更多相关文章
- jquery ui的css设计
jquery ui 是当前最强大的UI库之一,其两大卖点是对IE6的良好支持与换肤功能.为了构建avalon ui,今天起我将投入一部分精力来研究时下最流行的几个CSS框架.它是首当其冲. jquer ...
- OpenLayers学习笔记3——使用jQuery UI美化界面设计
PC端软件在开发是有较多的界面库能够选择,比方DevExpress.BCG.DotNetBar等,能够非常方便快捷的开发出一些炫酷的界面,近期在学习OpenLayers.涉及到web前端开发,在设计界 ...
- jQuery中的CSS(二)
一:获取样式和设置样式
- 【jQuery UI 1.8 The User Interface Library for jQuery】.学习笔记.1.CSS框架和其他功能
jquery.ui.all.css 1.所有主题必须的文件都包含在这个文件中.它由ui.base.css和ui.them.css两个文件中拉入的@import执行构成. jquery.ui.base. ...
- Struts2 JQuery UI常用插件
一.什么是插件 ①是遵循一定接口规范编写的程序 ②是原有系统平台功能的扩展和补充 ③只能运行在规定的系统平台下,而不能单独运行 注:由于jQuery插件是基于jQuery脚本库的扩展,所以所有jQue ...
- Jquery UI 和Easy UI常用插件
一.Jquery的插件简介 (一)什么是插件 插件(Plug-in)是一种遵循一定的应用程序接口规范编写出来的程序,是原有系统平台或应用软件平台功能的一种扩展和补充. 注意!!其只能在程序规定的系统平 ...
- jQuery UI常用插件使用
一.什么是插件 ①是遵循一定接口规范编写的程序 ②是原有系统平台功能的扩展和补充 ③只能运行在规定的系统平台下,而不能单独运行 注:由于jQuery插件是基于jQuery脚本库的扩展,所以所有jQue ...
- [转载]jQuery UI 使用
最近项目中使用了一些插件来做页面,这里把jQuery UI的使用分享出来,希望 对新手有帮助.文章结尾附源码下载. 1 jQuery UI 2 为我所用 2.1 Tabs 2. ...
- jQuery UI的datepicker日期控件如何让他显示中文
首先是引入UI的JS文件和模板文件,如下: <link rel=”stylesheet” href=”./ui/themes/le-frog/jquery.ui.all.css”> < ...
随机推荐
- 第12课:HTML基础之DOM操作1
DOM(Document Object Model):文本对象模型 dom对象实际上是html页面转成成的文本对象,可以通过dom对象中js提供的方法找到htm中的各个标签. 练习URL:http:/ ...
- Sqlserver:datetime类型的精度(不确定性)问题
转自http://www.xuebuyuan.com/212359.html 背景:近日进行大型数据表的迁移处理,遭遇创建 主键时 索引键值重复的错误.仔细检查原始表,并未有任何问题.分析后发现是迁移 ...
- opencv:基于颜色空间的肤色检测方法
参考链接:https://www.cnblogs.com/skyfsm/p/7868877.html
- 虚函数不应该是inlined(More Effective C++ 笔记)
在实际运行中,虚函数所需的代价与内联函数有关. 实际上虚函数不能是内联的. 这是因为“内联”是指“在编译期间用被调用的函数体本身来代替函数调用的指令,” 但是虚函数的“虚”是指“直到运行时才能知道要调 ...
- I.MX6 Manufacturing Tool V2 (MFGTool2) Update Command List (UCL) User Guide translate
Manufacturing Tool V2 (MFGTool2) Update Command List (UCL) User Guide Contents(目录) Contents(目录) ...
- fff
https://qa.tutormeet.com/tutormeet/tutormeet_FF.html?lang=3&data=MjAxODAzMjcxODAwMTQ1OXwyNzQ2fGp ...
- selenium定位元素的8种方法
By.id,By.name,By.tagName,By.className,By.linkText,By.partialLinkText,By.xpath,By.cssSelector <a h ...
- eclipse工程 'cocostudio/CocoStudio.h' file not found
android.mk里有这样配置: LOCAL_PATH := $(call my-dir) include $(CLEAR_VARS) $(call import-add-path,$(LOCAL_ ...
- HP-Mercury SiteScope安装及监控Weblogic操作
1.Mercury SiteScope简介Mercury SiteScope是一款无代理监测解决方案,可确保分布式IT基础架构——如服务器.操作系统.网络设备.网络服务.应用和应用组件的可用性和性能. ...
- gridview 绑定多个格式相同的数据源(数据查询合并)
在做项目时,要求在同一个GridView中同时显示不同分组中的前若干条数据 几个技术要点: 1.数据分组,本方法中未用group by 2.几个结果格式相同的查询合并绑定 3.取查询结果的前或后若干条 ...