上一篇见这里

本篇重点说一下其换肤功能

换肤一般是指改变控件的字体颜色,背景颜色,边框颜色,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设计二的更多相关文章

  1. jquery ui的css设计

    jquery ui 是当前最强大的UI库之一,其两大卖点是对IE6的良好支持与换肤功能.为了构建avalon ui,今天起我将投入一部分精力来研究时下最流行的几个CSS框架.它是首当其冲. jquer ...

  2. OpenLayers学习笔记3——使用jQuery UI美化界面设计

    PC端软件在开发是有较多的界面库能够选择,比方DevExpress.BCG.DotNetBar等,能够非常方便快捷的开发出一些炫酷的界面,近期在学习OpenLayers.涉及到web前端开发,在设计界 ...

  3. jQuery中的CSS(二)

    一:获取样式和设置样式

  4. 【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. ...

  5. Struts2 JQuery UI常用插件

    一.什么是插件 ①是遵循一定接口规范编写的程序 ②是原有系统平台功能的扩展和补充 ③只能运行在规定的系统平台下,而不能单独运行 注:由于jQuery插件是基于jQuery脚本库的扩展,所以所有jQue ...

  6. Jquery UI 和Easy UI常用插件

    一.Jquery的插件简介 (一)什么是插件 插件(Plug-in)是一种遵循一定的应用程序接口规范编写出来的程序,是原有系统平台或应用软件平台功能的一种扩展和补充. 注意!!其只能在程序规定的系统平 ...

  7. jQuery UI常用插件使用

    一.什么是插件 ①是遵循一定接口规范编写的程序 ②是原有系统平台功能的扩展和补充 ③只能运行在规定的系统平台下,而不能单独运行 注:由于jQuery插件是基于jQuery脚本库的扩展,所以所有jQue ...

  8. [转载]jQuery UI 使用

    最近项目中使用了一些插件来做页面,这里把jQuery UI的使用分享出来,希望 对新手有帮助.文章结尾附源码下载. 1     jQuery UI 2     为我所用 2.1     Tabs 2. ...

  9. jQuery UI的datepicker日期控件如何让他显示中文

    首先是引入UI的JS文件和模板文件,如下: <link rel=”stylesheet” href=”./ui/themes/le-frog/jquery.ui.all.css”> < ...

随机推荐

  1. 第12课:HTML基础之DOM操作1

    DOM(Document Object Model):文本对象模型 dom对象实际上是html页面转成成的文本对象,可以通过dom对象中js提供的方法找到htm中的各个标签. 练习URL:http:/ ...

  2. Sqlserver:datetime类型的精度(不确定性)问题

    转自http://www.xuebuyuan.com/212359.html 背景:近日进行大型数据表的迁移处理,遭遇创建 主键时 索引键值重复的错误.仔细检查原始表,并未有任何问题.分析后发现是迁移 ...

  3. opencv:基于颜色空间的肤色检测方法

    参考链接:https://www.cnblogs.com/skyfsm/p/7868877.html

  4. 虚函数不应该是inlined(More Effective C++ 笔记)

    在实际运行中,虚函数所需的代价与内联函数有关. 实际上虚函数不能是内联的. 这是因为“内联”是指“在编译期间用被调用的函数体本身来代替函数调用的指令,” 但是虚函数的“虚”是指“直到运行时才能知道要调 ...

  5. 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(目录)     ...

  6. fff

    https://qa.tutormeet.com/tutormeet/tutormeet_FF.html?lang=3&data=MjAxODAzMjcxODAwMTQ1OXwyNzQ2fGp ...

  7. selenium定位元素的8种方法

    By.id,By.name,By.tagName,By.className,By.linkText,By.partialLinkText,By.xpath,By.cssSelector <a h ...

  8. eclipse工程 'cocostudio/CocoStudio.h' file not found

    android.mk里有这样配置: LOCAL_PATH := $(call my-dir) include $(CLEAR_VARS) $(call import-add-path,$(LOCAL_ ...

  9. HP-Mercury SiteScope安装及监控Weblogic操作

    1.Mercury SiteScope简介Mercury SiteScope是一款无代理监测解决方案,可确保分布式IT基础架构——如服务器.操作系统.网络设备.网络服务.应用和应用组件的可用性和性能. ...

  10. gridview 绑定多个格式相同的数据源(数据查询合并)

    在做项目时,要求在同一个GridView中同时显示不同分组中的前若干条数据 几个技术要点: 1.数据分组,本方法中未用group by 2.几个结果格式相同的查询合并绑定 3.取查询结果的前或后若干条 ...