Framework Classes

Layout Helper

• .ui-helper-hidden: 隱藏元素,Style{display:none}.
• .ui-helper-hidden-accessible: 把元素的絕對位置設到無法閱讀處.
• .ui-helper-reset: 重設元素的Style{ padding, margins, text-decoration, list-style }.
• .ui-helper-clearfix: 設定給浮動元素之Parent元素,設定為inline-block
• .ui-helper-zfix: 修正iframe元件覆蓋問題.

Widget Containers

• .ui-widget: 定義元素為元件容器,如: Form、Window.
• .ui-widget-header: 定義元素為元件容器標題.
• .ui-widget-content: 定義元素為元件容器內容框.

Interaction States

• .ui-state-default: 設定button處於一般狀態風格.
• .ui-state-hover: 設定button處於Mouse Hover狀態風格.
• .ui-state-focus: 設定button處於Foucs狀態風格.
• .ui-state-active: 設定button處於Click/Active瞬間的狀態風格.

Interaction Cues

• .ui-state-highlight: 設定元素處於Highlight狀態風格.
• .ui-state-error: 設定元素處於錯誤狀態風格.
• .ui-state-error-text: 設定錯誤文字顯示風格.
• .ui-state-disabled: 設定元素處於disabled狀態風格.
• .ui-priority-primary: 設定元素為首選button之風格.
• .ui-priority-secondary: 設定元素為第二優先button之風格.

Icons - States and images

• .ui-icon: 設定此元素為icon,實際圖形需依賴ui-icon-xxxx(173個圖形)相關class決定套用之圖形,
• .ui-icon-xxxx: 參考ThemeRoller最末端圖形hint之class名稱，決定套用之圖形.

Misc Visuals - Corner Radius helpers

• .ui-corner-tl: 元素之左上角為圓邊.
• .ui-corner-tr: 元素之右上角為圓邊.
• .ui-corner-bl: 元素之左下角為圓邊.
• .ui-corner-br: 元素之右上角為圓邊.
• .ui-corner-top: 元素之上方兩角為圓邊.
• .ui-corner-bottom: 元素之下方兩角為圓邊.
• .ui-corner-right: 元素之右方兩角為圓邊.
• .ui-corner-left: 元素之左方兩角為圓邊.
• .ui-corner-all: 元素之四角為圓邊.

Misc Visuals - Overlay & Shadow

• .ui-widget-overlay: 定義該元素為全螢幕遮罩風格.
• .ui-widget-shadow: 定義該元素具備陰影風格.

詳細位置 - sheauren的jquery紀錄