API
概述
和绝大多数 UI 框架一样，CMUI 提供的接口以 HTML 结构约定和元素的类名为主。
此外，为保证样式统一，CMUI 也抽象出了一些变量供业务层使用；为提升开发效率，CMUI 还为业务层提供了一些工具性的 mixin。
类名
CMUI 提供的通用工具类如下：
布局
.clearfix- 闭合浮动（它是通过
clearfix()这个 mixin 来实现的）
尺寸
.cm-x20- 将元素的宽高均设置为 20px
.cm-x30- 将元素的宽高均设置为 30px
.cm-x40- 将元素的宽高均设置为 40px
.cm-x50- 将元素的宽高均设置为 50px
变量
注意：仅当业务层以 Stylus 作为 CSS 开发语言、且已引入 CMUI 的样式入口文件（
src/css/theme/*/index.styl）时可使用 “变量” 作为 API。
注意：业务层应把这些变量视为常量，不应在业务开发中修改它们的值。
CMUI 提供的 Stylus 变量包括：
- 颜色变量：请参见 颜色 章节。
- 其它变量：其它变量的值和含义如下。
字体大小
$cm-font-size-s = 12px- 小字号（次要文字等）
$cm-font-size = 14px- 常规字号（正文、段落等）
$cm-font-size-l = 16px- 大字号（标题等）
$cm-font-size-xl = 18px- 超大字号（重着强调的文字等）
文字行高
$cm-line-height = 1.5- 默认行高
$cm-line-height-min = 1.2- 最小行高（某些 UI 元素可能需要把行高压缩到最小值）
$cm-line-height-text = 1.5- 段落文本的行高
布局
$cm-content-padding = 10px- 文本距离容器边缘的空隙
$cm-section-gap = 10px- 列表区块之间的空隙、表单区块之间的空隙
Mixin
注意：仅当业务层以 Stylus 作为 CSS 开发语言、且已引入 CMUI 的样式入口文件（
src/css/theme/*/index.styl）时可使用 “mixin” 作为 API。
Mixin 可以生成多行声明或多条规则，从而实现某种样式或功能。
布局
clearfix()- 闭合浮动
环境信息
注意：这个接口是为 CMUI 的开发者准备的内部功能，不建议在业务开发中使用。
为便于开发者针对不同浏览器及其特性写样式，CMUI 脚本会自动根据当前浏览器环境为
<html> 元素添加以下类：
.cmui—— 表示 CMUI 的脚本文件已加载。
.ios—— 表示当前的移动操作系统是 iOS（根据 UA 信息判断）。-
.android—— 表示当前的移动操作系统是 Android（根据 UA 信息判断）。 -
.legacy—— 表示当前的移动操作系统版本过低（根据 UA 信息判断），比如 iOS 版本低于 7 或 Android 版本低于 4。
-
.mobile—— 表示当前用户处于移动操作系统（根据 UA 信息判断），iOS 和 Android 将被视为移动操作系统。 -
.desktop—— 表示当前用户处于桌面操作系统（根据 UA 信息判断），非 iOS 和 Android 一律视为桌面操作系统。
.safari—— 表示当前浏览器是 Safari，包括桌面版和移动版（根据 UA 信息判断）。.chrome—— 表示当前浏览器是 Chrome，包括桌面版和移动版（根据 UA 信息判断）。
.touch—— 表示当前浏览器支持触摸事件（根据特性探测）。-
.no-touch—— 表示当前浏览器不支持触摸事件（根据特性探测）。
如果需要在脚本中判断浏览器等环境特征，请参考 Gearbox 提供的 相关 API。
CMUI 脚本会在加载后尝试移除 <html> 元素的 .no-js 类。
这意味着，如果你在编写 HTML 时预先给 <html> 元素写上这个类，就可以利用
html.no-js 作为顶层选择符来编写无脚本情况下的 fallback 样式，以保障可访问性。