三種方式創建按鈕:
<button>按鈕</button> //用於表單提交
<input type="button" value="按鈕"> //用於表單提交
<a href="#link" data-role="button">按鈕</a> //推薦用這種形式的按鈕
導航按鈕: <a href="#page2" data-role="button">轉到page2</a>
行內按鈕:data-inline="true" 可使按鈕寬度自適應其內容 (按鈕默認情況會佔據屏幕的全部寬度)
<a href="#page2" data-role="button" data-inline="true">轉到page2</a>
組合按鈕:data-role="controlgroup" data-type="horizontal | vertical" 水平或垂直排列一組按鈕
<div data-role="controlgroup" data-type="horizontal">
<a href="#link" data-role="button">button1</a>
<a href="#link" data-role="button">button2</a>
<a href="#link" data-role="button">button3</a>
</div>
p.s. 水平分組按鈕,默認是data-inline="true"
後退按鈕:data-rel="back" (此時會忽略href的值)
<a href="#" data-role="button" data-rel="back" >返回</a>
其他按鈕樣式屬性:data-corners="true | false " //按鈕是否有圓角
data-mini="true | false " //按鈕是否是小型按鈕
data-shadow="true | false " //按鈕是否有陰影,默認是有
按鈕圖標: data-icon="search" // 默認按鈕中的圖標位置是靠左放置
<a href="#anylink" data-role="button" data-icon="search">搜索</a>
data-icon="arrow-l | arrow-r" // 左/右箭頭圖標的按鈕
data-icon="delete" // 刪除
data-icon="info" // 信息
data-icon="home" //首頁
data-icon="forward | back" / 向前/返回
data-icon="search" //搜索
data-icon="grid" //網格
data-icon="plus|minus" // 加/減符號
data-icon="check" //勾選
data-icon="star" //星
data-icon="gear" //齒輪形
data-icon="arrow-d | arrow-u" // 向下/上箭頭
定位按鈕圖標: data-iconpos="top | right | botton | left " // 可以重置按鈕上的圖標位置- 上,右,下,左
<a href="#link" data-role="button" data-icon="search" data-iconpos="top" > 上 </a>
圖標按鈕:data-iconpos="notext" // 只顯示圖標,沒有文本
<a href="#link" data-role="button" data-icon="search" data-iconpos="notext" > 搜索 </a> //鼠標移到圖標上會看到提示文本:搜索