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实现点击链接弹出"图片另存为"而不是直接打开
Aug 15 Javascript
解析img图片没找到onerror事件 Stack overflow at line: 0
Dec 23 Javascript
JS弹出层单纯的绝对定位居中示例代码
Feb 18 Javascript
alert出数组中的随即值代码
Sep 25 Javascript
jQuery中prependTo()方法用法实例
Jan 08 Javascript
jQuery trigger()方法用法介绍
Jan 13 Javascript
BootStrap Table后台分页时前台删除最后一页所有数据refresh刷新后无数据问题
Dec 28 Javascript
jQuery实现的简单无刷新评论功能示例
Nov 08 jQuery
vue.js 嵌套循环、if判断、动态删除的实例
Mar 07 Javascript
jquery实现上传文件进度条
Mar 26 jQuery
原生JavaScript实现拖动校验功能
Sep 29 Javascript
原生js实现自定义滚动条组件
Jan 20 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
什么是调频(FM)、调幅(AM)、短波(SW)、长波(LW)
2021/03/01 无线电
PHP安装全攻略:APACHE
2006/10/09 PHP
十天学会php之第七天
2006/10/09 PHP
php中的三元运算符使用说明
2011/07/03 PHP
php实现singleton()单例模式实例
2014/11/06 PHP
PHP进行批量任务处理不超时的解决方法
2016/07/11 PHP
Laravel find in set排序实例
2019/10/09 PHP
php获取是星期几的的一些常用姿势
2019/12/15 PHP
javascript引用对象的方法代码
2007/08/13 Javascript
20款效果非常棒的 jQuery 插件小结分享
2011/11/18 Javascript
充分发挥Node.js程序性能的一些方法介绍
2015/06/23 Javascript
详解JavaScript中的事件流和事件处理程序
2016/05/20 Javascript
微信小程序实战之自定义抽屉菜单(7)
2017/04/18 Javascript
layui表格checkbox选择全选样式及功能的实例
2018/03/07 Javascript
VUE-cli3使用 svg-sprite-loader
2018/10/20 Javascript
react-router4按需加载(踩坑填坑)
2019/01/06 Javascript
python使用TensorFlow进行图像处理的方法
2018/02/28 Python
Flask框架信号用法实例分析
2018/07/24 Python
3个用于数据科学的顶级Python库
2018/09/29 Python
Python模块的制作方法实例分析
2019/12/21 Python
Python编程快速上手——Excel表格创建乘法表案例分析
2020/02/28 Python
python读取图片颜色值并生成excel像素画的方法实例
2021/02/19 Python
CSS3关于z-index不生效问题的解决
2020/02/19 HTML / CSS
Spanx塑身衣官网:美国知名内衣品牌
2017/01/11 全球购物
美国学校用品、教室和教学商店:Discount School Supply
2018/04/04 全球购物
Book Depository澳大利亚:世界领先的专业在线书店之一
2018/12/27 全球购物
意大利珠宝店:Luxury Zone
2019/01/05 全球购物
大学本科生的个人自我评价
2013/12/09 职场文书
财务担保书范文
2014/04/02 职场文书
党代会心得体会
2014/09/04 职场文书
求职自荐信怎么写
2015/03/04 职场文书
致运动员赞词
2015/07/22 职场文书
html5 录制mp3音频支持采样率和比特率设置
2021/07/15 Javascript
python之PySide2安装使用及QT Designer UI设计案例教程
2021/07/26 Python
Python进行区间取值案例讲解
2021/08/02 Python
Python 装饰器(decorator)常用的创建方式及解析
2022/04/24 Python