上一篇见这里

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

换肤一般是指改变控件的字体颜色,背景颜色,边框颜色,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. [转载]java正则表达式

    转载自:http://butter.iteye.com/blog/1189600 1.正则表达式的知识要点1.正则表达式是什么?正则表达式是一种可以用于模式匹配和替换的强有力的工具.2.正则表达式的优 ...

  2. kmp&扩展kmp

    kmp: KMP的主要目的是求B是不是A的子串,以及若是,B在A中所有出现的位置 写的很详细的大佬的博客:http://www.matrix67.com/blog/archives/115 模板: / ...

  3. Use appropriate component from RM component palette

    --------------------------- 错误 --------------------------- Opened report contains the following non- ...

  4. L202

    Yuan Cao’s teenage years were hardly typical. By age 18, he had already graduated from high school, ...

  5. show()是非模式窗体. showDialog()是模式窗体.

    show()仅仅是显示出来窗口界面而已```也就是和你执行的结果在同一窗口显示```所显示的窗口可以在后台运行```而showDialog()是一个对话框窗口界面```执行结果以新窗口界面出现```不 ...

  6. 选择语句=》OO函数实现

    let a; let b; if (a==="A") { b='定向' }else if (a==='B') { b='开放' }else if(a==='C') { b='全部' ...

  7. centos 搭建 docker sentry

    1.安装 http://blog.51cto.com/linuxg/2052927 2 .实际调试: 项目: <title>hghh</title> <script sr ...

  8. 2018c语言第2次作业

    1 删除字符串中数字字符 1.设计思路 (1)主要描述题目算法 第一步:先用for循环比较每个数是否符合删除条件. 第二步:如果符合就把这个数利用交换把这个数提前一位. 2.实验代码 void del ...

  9. Js 实战3(实现全选)

    <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default4.aspx.cs ...

  10. nats 学习 request/reply 模式基本使用

    nats 一个云原生的消息系统,使用简单,客户端丰富,支持的模式是pub/sub 但是集成比较灵活,可以支持loadblance, request/reply pub/sub 代码演示的是reques ...