全棧工程師開發手冊 (作者:栾鵬)
jQuery Mobile 所有class選項:
全局類:
//ui-corner-all 為元素添加圓角
//ui-shadow 為元素添加陰影
//ui-overlay-shadow 為元素添加多層陰影
//ui-mini 讓元素變小
按鈕類:
// 或 元素添加以下類 (不是 按鈕):
//ui-btn 添加在 元素上并以按鈕形式展示
//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" 修改顔色為黑色背景白色文本
//ui-btn-left 按鈕位置靠左
//ui-btn-right 按鈕位置靠右
圖示類:
//ui-icon-action 動作 (一般用于頁面跳轉切換) action
//ui-icon-alert 三角形内的感歎号 alert
//ui-icon-audio 音響/音箱 audio
//ui-icon-arrow-d-l 左下角箭頭 arrow-d-l
//ui-icon-arrow-d-r 右下角箭頭 arrow-d-r
//ui-icon-arrow-u-l 左上角箭頭 arrow-u-l
//ui-icon-arrow-u-r 右上角箭頭 arrow-u-r
//ui-icon-arrow-l 左角箭頭 arrow-l
//ui-icon-arrow-r 右角箭頭 arrow-r
//ui-icon-arrow-u 向上箭頭 arrow-u
//ui-icon-arrow-d 向下箭頭 arrow-d
//ui-icon-back 傳回 back
//ui-icon-bars 三條水準線,一般用于展示清單按鈕圖示 bars
//ui-icon-bullets 用于展示清單按鈕圖示 bullets
//ui-icon-calendar 月曆 calendar
//ui-icon-camera 相機 camera
//ui-icon-carat-d 向下滑動圖示 carat-d
//ui-icon-carat-l 向左滑動圖示 carat-l
//ui-icon-carat-r 向右滑動圖示 carat-r
//ui-icon-carat-u 向上滑動圖示 carat-u
//ui-icon-check 勾選 check
//ui-icon-clock 鬧鐘 clock
//ui-icon-cloud 雲 cloud
//ui-icon-comment 評論 / 消息 comment
//ui-icon-delete 删除 delete
//ui-icon-edit 編輯 / 鉛筆 edit
//ui-icon-eye 眼睛 eye
//ui-icon-forbidden 禁用辨別 sign forbidden
//ui-icon-forward 撤銷 - (傳回上一步) forward
//ui-icon-gear 齒輪,一般用于設定按鈕圖示 gear
//ui-icon-grid 網格 grid
//ui-icon-heart 心型,可用于文章收藏 heart
//ui-icon-home 首頁 home
//ui-icon-info 資訊 info
//ui-icon-location 定位 location
//ui-icon-lock 鎖 lock
//ui-icon-mail 郵件 / 信封 mail
//ui-icon-minus 減号 minus
//ui-icon-navigation 導航 navigation
//ui-icon-phone 電話 phone
//ui-icon-power 開關 (On/off) power
//ui-icon-plus 加号 plus
//ui-icon-recycle 循環 辨別 recycle
//ui-icon-refresh 重新整理 refresh
//ui-icon-search 搜尋 / 放大鏡 search
//ui-icon-shop 商店/購物袋 shop
//ui-icon-star 星号 star
//ui-icon-tag 标簽 tag
//ui-icon-user 使用者 / 人物 user
//ui-icon-video 視訊 / 相機
//ui-nodisc-icon 移除圖示的灰色圓圈,
//ui-alt-icon 圖示顯示為黑色(預設為白色)
主題類:
// Classes 字母 (a-z) 意為樣式可以指定 a 到 z。例如 ui-bar-a 或 ui-bar-b等
//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-solo 100% ui-block-a
//ui-grid-a 50% / 50% ui-block-a|
//ui-grid-b 33% / 33% / 33% ui-block-a|b|c
//ui-grid-c 25% / 25% / 25% / 25% ui-block-a|b|c|d
//ui-grid-d 20% / 20% / 20% / 20% / 20% ui-block-a|b|c|d|e