国产av日韩一区二区三区精品,成人性爱视频在线观看,国产,欧美,日韩,一区,www.成色av久久成人,2222eeee成人天堂

directory search
jQuery Mobile 基礎(chǔ)教程 jQuery Mobile 安裝 jQuery Mobile 頁面 jQuery Mobile 頁面切換 jQuery Mobile 按鈕 jQuery Mobile 按鈕圖標 jQuery Mobile 工具欄 jQuery Mobile 可折疊塊 jQuery Mobile 網(wǎng)格 jQuery Mobile 表單 jQuery Mobile 表單 jQuery Mobile 表單輸入元素 jQuery Mobile 表單選擇菜單 jQuery Mobile 表單滑動條 jQuery Mobile 列表 jQuery Mobile 列表視圖 jQuery Mobile 列表內(nèi)容 jQuery Mobile 事件 jQuery Mobile 事件 jQuery Mobile 觸摸事件 jQuery Mobile 滾屏事件 jQuery Mobile 方向改變事件 jQuery Mobile 實例 jQuery Mobile Data 屬性 jQuery Mobile 圖標 jQuery Mobile 事件 jQuery Mobile orientationchange 事件 jQuery Mobile pagebeforecreate 事件 jQuery 事件 方法 jQuery bind() 方法 jQuery blur() 方法 jQuery change() 方法 jQuery click() 方法 jQuery dblclick() 事件 jQuery delegate() 方法 jQuery die() 方法 jQuery error() 方法 jQuery event.currentTarget 屬性 jQuery event.data 屬性 jQuery event.delegateTarget 屬性 jQuery event.isDefaultPrevented() 方法 jQuery event.isImmediatePropagationStopped() 方法 jQuery event.isPropagationStopped() 方法 jQuery event.namespace 屬性 jQuery event.pageX 屬性 jQuery event.pageY 屬性 jQuery event.preventDefault() 方法 jQuery event.relatedTarget 屬性 jQuery event.result 屬性 jQuery event.stopImmediatePropagation() 方法 jQuery event.stopPropagation() 方法 jQuery event.target 屬性 jQuery event.timeStamp 屬性 jQuery event.type 屬性 jQuery event.which 屬性 jQuery focus() 方法 jQuery focusin() 方法 jQuery focusout() 方法 jQuery hover() 方法 jQuery keydown() 方法 jQuery keypress() 方法 jQuery keyup() 方法 jQuery live() 方法 jQuery load() 方法 jQuery mousedown() 方法 jQuery mouseenter() 方法 jQuery mouseleave() 方法 jQuery mousemove() 方法 jQuery mouseout() 方法 jQuery mouseover() 方法 jQuery mouseup() 方法 jQuery off() 方法 jQuery on() 方法 jQuery one() 方法 jQuery $.proxy() 方法 jQuery ready() 方法 jQuery resize() 方法 jQuery scroll() 方法 jQuery select() 方法 jQuery submit() 方法 jQuery toggle() 方法 jQuery trigger() 方法 jQuery triggerHandler() 方法 jQuery unbind() 方法 jQuery undelegate() 方法 jQuery unload() 方法 jQuery Mobile pagebeforehide 事件 jQuery Mobile pagebeforeload 事件 jQuery Mobile pagebeforeshow 事件 jQuery Mobile pagecreate 事件 jQuery Mobile pagehide 事件 jQuery Mobile pageinit 事件 jQuery Mobile pageload 事件 jQuery Mobile pageloadfailed 事件 jQuery Mobile pageshow 事件 jQuery Mobile scrollstart 事件 jQuery Mobile scrollstop 事件 jQuery Mobile swipe 事件 jQuery Mobile swipeleft 事件 jQuery Mobile swiperight 事件 jQuery Mobile tap 事件 jQuery Mobile taphold 事件 jQuery Mobile 頁面事件 jQuery Mobile CSS 類 jQuery Mobile 主題 jQuery Mobile 主題 jQuery Mobile 圖標
characters

jQuery Mobile 主題

jQuery Mobile 提供了5種不同的主題樣式, 從 "a" 到 "e" - 每一種主題的按鈕，工具條，內(nèi)容塊等等顏色都不一致，每個主題的視覺效果也不一樣。

通過設(shè)置元素的data-theme屬性可以自定義應用的外觀:

<div?data-role="page"?data-theme="a|b|c|d|e">


值 描述 實例
a 默認。黑色背景白色文字 實例?
b 藍色背景白色文字/ 黑色文字灰色背景 實例?
c 黑色文字淺灰色背景 實例?
d 黑色為主白色背景 實例?
e 黑色文字橙色背景 實例?


你喜歡混合主題！

默認情況下， jQuery Mobile 使用 "a" 主題 (黑色) 來設(shè)置頭部和底部 ， "c" 主題 (淺灰色) 設(shè)置頁面內(nèi)容。 但是，你可以自定義設(shè)置你喜歡的混合主題。

主題頭部，內(nèi)容和底部

實例

<div data-role="header" data-theme="b"></div>

<div data-role="content" data-theme="a"></div>

<div data-role="footer" data-theme="e"></div>
效果預覽 ?

主題對話框

實例

<a href="#pagetwo" data-rel="dialog">Go To The Themed Dialog Page</a>

<div data-role="page" id="pagetwo" data-overlay-theme="e">
? <div data-role="header" data-theme="b"></div>
? <div data-role="content" data-theme="a"></div>
? <div data-role="footer" data-theme="c"></div>
</div>
效果預覽 ?

主題按鈕

實例

<a href="#" data-role="button" data-theme="a">Button</a>
<a href="#" data-role="button" data-theme="b">Button</a>
<a href="#" data-role="button" data-theme="c">Button</a>
效果預覽 ?

主題圖標

實例

<a href="#" data-role="button" data-icon="plus" data-theme="e">Plus</a>
效果預覽 ?

頭部和底部的主題按鈕

實例

<div data-role="header">
? <a href="#" data-role="button" data-icon="home" data-theme="b">Home</a>
? <h1>Welcome To My Homepage</h1>
? <a href="#" data-role="button" data-icon="search" data-theme="e">Search</a>
</div>

<div data-role="footer">
? <a href="#" data-role="button" data-theme="b" data-icon="plus">Button 1</a>
? <a href="#" data-role="button" data-theme="c" data-icon="plus">Button 2</a>
? <a href="#" data-role="button" data-theme="e" data-icon="plus">Button 3</a>
</div>
效果預覽 ?

主題導航條

實例

<div data-role="footer" data-theme="e">
? <h1>Insert Footer Text Here</h1>
? <div data-role="navbar">
??? <ul>
????? <li><a href="#" data-icon="home" data-theme="b">Button 1</a></li>
????? <li><a href="#" data-icon="arrow-r">Button 2</a></li>
????? <li><a href="#" data-icon="arrow-r">Button 3</a></li>
????? <li><a href="#" data-icon="search" data-theme="a" >Button 4</a></li>
??? </ul>
? </div> 
</div>
效果預覽 ?

主題可折疊按鈕和內(nèi)容

實例

<div data-role="collapsible" data-theme="b" data-content-theme="e">
? <h1>Click me - I'm collapsible!</h1>
? <p>I'm the expanded content.</p>
</div>
效果預覽 ?

主題列表

實例

<ul data-role="listview" data-theme="e">
? <li><a href="#">List Item</a></li>
? <li data-theme="a"><a href="#">List Item</a></li>
? <li data-theme="b"><a href="#">List Item</a></li>
? <li><a href="#">List Item</a></li>
</ul>
效果預覽 ?

主題分割按鈕

實例

<ul?data-role="listview"?data-split-theme="e">
效果預覽 ?

主題可折疊列表

實例

<div data-role="collapsible" data-theme="b" data-content-theme="e">
? <ul data-role="listview">
??? <li><a href="#">Agnes</a></li>
? </ul>
</div>
效果預覽 ?

主題表單

實例

<label for="name">Full Name:</label>
<input type="text" name="text" id="name" data-theme="a">

<label for="colors">Choose Favorite Color:</label>
<select id="colors" name="colors" data-theme="b">
? <option value="red">Red</option>
? <option value="green">Green</option>
? <option value="blue">Blue</option>
</select>
效果預覽 ?

主題可折疊表單

實例

<fieldset data-role="collapsible" data-theme="b" data-content-theme="e">
 <legend>Click me - I'm collapsible!</legend>
效果預覽 ?

添加新主題

jQuery Mobile 可以在移動頁面添加新主題。

通過修改 CSS 文件來添加或編輯新主題(如果你已經(jīng)下載了 jQuery Mobile)。你只需要拷貝樣式模塊，然后重命令字母類名（f-z）,并在樣式中添加你喜歡的顏色和字體。

你也可以在 HTML 文檔中添加主題的新樣式 - 工具條添加類： ui-bar-(a-z) ，文本內(nèi)容添加類: ui-body-(a-z) for the content:

實例

<style>
.ui-bar-f
{
color:green;
background-color:yellow;
 }
.ui-body-f
{
font-weight:bold;
color:purple;
}
</style>
效果預覽 ?
Previous article： Next article：