雷林鹏分享：jQuery Mobile CSS 类
jQuery Mobile CSS 类
jQuery CSS 类
jQuery Mobile CSS 类来设置不同元素的样式。
以下列表包含了通用的 CSS 样式：
全局类
以下类可以在 jQuery Mobile 小工具中使用 (按钮，工具条，面板，表格，列表等。):
Class描述
ui-corner-all为元素添加圆角
ui-shadow为元素添加阴影
ui-overlay-shadow为元素添加多层阴影
ui-mini让元素变小
按钮类
除了全局类外，你可以向 或元素添加以下类 (不是 按钮):
Class描述
ui-btn-inline在同一行上显示按钮
ui-btn-icon-top定位图标在按钮文本之上
ui-btn-icon-right定位图标在按钮文本的右边
ui-btn-icon-bottom定位图标在按钮文本之下
ui-btn-icon-left定位图标在按钮文本的左边
ui-btn-icon-notext只显示图标
ui-btn-a|b指定按钮演示。"a" 是默认的 (灰色背景黑色文本样式), "b" 修改颜色为黑色背景白色文本
图标类
元素上 (查看 jQuery Mobile 图标参考手册 了解如何在其他元素上使用):
Class图标描述图标
ui-icon-bars三条水平线，一般用于展示列表按钮图标
主题类 Classes
jQuery Mobile 提供了两个主题类: a (灰) 和 b (黑)。 但是，你可以创建你自己的自定义类 - 可定义到字母 "z" (查看 jQuery Mobile 主题 )。 下表列出了可用的主题类。 字母 (a-z) 意为样式可以指定 a 到 z。例如 ui-bar-a 或 ui-bar-b等。
Class描述
ui-bar-(a-z)指定栏目演示 - 头部，底部及其他栏目
ui-body-(a-z)指定内容块的颜色 - 页面内容部分 ( 1.4.0 版本已废弃), 列表视图， 弹窗, 侧栏，面板，加载，折叠。
ui-btn-(a-z)指定按钮颜色
ui-group-theme-(a-z)定义了控制组的演示 listviews 和 collapsible 集合。
ui-overlay-(a-z)定义了页面背景颜色，包括对话框，弹窗和其他出现在最顶层的页面容器
ui-page-theme-(a-z)定义了页面演示
网格类
网格中的列是等宽的(合计是 100%)，没有边框、背景、margin 或 padding。 这里有四种布局网格可供使用：
网格类列列宽对应实例
ui-grid-solo1100%ui-block-a尝试一下
ui-grid-a250% / 50%ui-block-a|b尝试一下
ui-grid-b333% / 33% / 33%ui-block-a|b|c 尝试一下
ui-grid-c425% / 25% / 25% / 25%ui-block-a|b|c|d尝试一下
ui-grid-d520% / 20% / 20% / 20% / 20%ui-block-a|b|c|d|e尝试一下
更多信息可以查看 jQuery Mobile 网格 章节。
本文转载自：w3cschool
(编辑：雷林鹏 来源：网络 侵删)
