Jquery ui css framework


Posted in Javascript onJune 28, 2010

Jquery ui中两大核心的css文件是ui.core.css和ui.theme.css.这两个css样式贯穿整个基于jquery ui的界面上,并且可以通过jquery ui ThemeRoller来生成自己的样式。

.ui-helper-hidden :为元素应用display:none

.ui-helper-hidden-accessible:将元素的绝对位置设置为不可见

.ui-helper-clearfix:适用于浮动包裹父元素的属性

. ui-helper-zfix:适用于修复iframe元素覆盖的问题

.ui-state-default:元素的默认样式

.ui-state-hover:元素为hover状态的样式

.ui-state-focus:元素为focus状态的样式

.ui-state-active:元素为active状态(一般为鼠标选中)的样式

.ui-state-hightlight:需要高亮状态的样式

.ui-state-error:元素为错误状态(一般描述错误信息)的样式

.ui-state-error-text:描述错误文字的样式

.ui-state-disabled:元素被禁用的样式

.ui-priority-primary:被应用于级别为第一级的button,如果button需要区分曾记的话。将应用加粗字体

.ui-priority-secondary:被应用于级别为第二级的button,和上一场景相对应,将应用一般粗细的字体,并且相对于元素轻度透明

Icon types:css framework提供了一套默认的图标,这些图标适用于大多场景,一般使用的方式是“ui-icon ui-icon-****”来指定icon

.ui-corner-tl:左上角圆角,基于css3,ie不支持

.ui-corner-tr:右上角圆角,基于css3,ie不支持

.ui-corner-bl:左下角圆角,基于css3,ie不支持

.ui-corner-br:右下角圆角,基于css3,ie不支持

.ui-corner-top:上面两个角圆角,基于css3,ie不支持

.ui-corner-bottom:底部两个角圆角,基于css3,ie不支持

.ui-corner-right:右部两个角圆角,基于css3,ie不支持

.ui-corner-left:左部两个角圆角,基于css3,ie不支持

.ui-corner-all:全部角圆角,基于css3,ie不支持

.ui-widget-overlay:遮罩

.ui-widget-shadow:阴影

在写jquery ui widget的时候合适的利用这些css就可以做出和jquery ui theme兼容的自定义ui来。

Javascript 相关文章推荐
Javascript 定时器调用传递参数的方法
Nov 12 Javascript
JavaScript Chart 插件整理
Jun 18 Javascript
一个很有趣3D球状标签云兼容IE8
Aug 22 Javascript
浅谈JavaScript的Polymer框架中的事件绑定
Jul 29 Javascript
JavaScript学习笔记(三):JavaScript也有入口Main函数
Sep 12 Javascript
Jquery实现的简单轮播效果【附实例】
Apr 19 Javascript
Javascript基础教程之比较null和undefined值
May 16 Javascript
JavaScript生成验证码并实现验证功能
Sep 24 Javascript
jQuery实现的购物车物品数量加减功能代码
Nov 16 Javascript
JavaScript实现删除数组重复元素的5种常用高效算法总结
Jan 18 Javascript
详解vue组件之间的通信
Aug 30 Javascript
html实现随机点名器的示例代码
Apr 02 Javascript
Javascript创建Silverlight Plugin以及自定义nonSilverlight和lowSilverlight样式
Jun 28 #Javascript
JavaScript Tips 使用DocumentFragment加快DOM渲染速度
Jun 28 #Javascript
js getElementsByTagName的简写方式
Jun 27 #Javascript
两种简单实现菜单高亮显示的JS类代码
Jun 27 #Javascript
用apply让javascript函数仅执行一次的代码
Jun 27 #Javascript
验证javascript中Object和Function的关系的三段简单代码
Jun 27 #Javascript
jQuery选择头像并实时显示的代码
Jun 27 #Javascript
You might like
mysql_fetch_assoc和mysql_fetch_row的功能加起来就是mysql_fetch_array
2007/01/15 PHP
谨慎使用PHP的引用原因分析
2012/09/06 PHP
php返回当前日期或者指定日期是周几
2015/05/21 PHP
php实现的Curl封装类Curl.class.php用法实例分析
2015/09/25 PHP
thinkPHP实现递归循环栏目并按照树形结构无限极输出的方法
2016/05/19 PHP
laravel实现按时间日期进行分组统计方法示例
2019/03/23 PHP
Yii2.0框架模型多表关联查询示例
2019/07/18 PHP
Yii 框架使用Forms操作详解
2020/05/18 PHP
phpwind放自动注册方法
2006/12/02 Javascript
Javascript实现的分页函数
2006/12/22 Javascript
使用jquery为table动态添加行的实现代码
2011/03/30 Javascript
in.js 一个轻量级的JavaScript颗粒化模块加载和依赖关系管理解决方案
2011/07/26 Javascript
模拟select的代码
2011/10/19 Javascript
js 设置缓存及获取设置的缓存
2014/05/08 Javascript
Javascript的setTimeout()使用闭包特性时需要注意的问题
2014/09/23 Javascript
jQuery控制frames及frame页面JS的方法
2016/03/08 Javascript
vue移动端微信授权登录插件封装的实例
2018/08/28 Javascript
Vue.js构建你的第一个包并在NPM上发布的方法步骤
2019/05/01 Javascript
了解javascript中变量及函数的提升
2019/05/27 Javascript
通过图带你深入了解vue的响应式原理
2019/06/21 Javascript
微信小程序云开发如何实现数据库自动备份实现
2019/08/16 Javascript
JavaScript设计模型Iterator实例解析
2020/01/22 Javascript
[01:06:59]完美世界DOTA2联赛PWL S2 Magma vs FTD 第一场 11.29
2020/12/02 DOTA
Python中针对函数处理的特殊方法
2014/03/06 Python
python中redis的安装和使用
2016/12/04 Python
numpy基础教程之np.linalg
2019/02/12 Python
python爬虫添加请求头代码实例
2019/12/28 Python
python实现梯度下降法
2020/03/24 Python
python+adb命令实现自动刷视频脚本案例
2020/04/23 Python
浅谈python处理json和redis hash的坑
2020/07/16 Python
python pygame 愤怒的小鸟游戏示例代码
2021/02/25 Python
CSS3选择器新增问题的实现
2021/01/21 HTML / CSS
解释一下抽象方法和抽象类
2016/08/27 面试题
清洁工表扬信
2014/01/08 职场文书
特此通知格式
2015/04/27 职场文书
校运会新闻稿
2015/07/17 职场文书