jQuery Mobile的提供了一組圖標，這將使你的按鈕看起來更可取。
添加圖標到jQuery Mobile的按鈕
要將圖標添加到您的按鈕，使用ui-icon類和圖標，圖標位置的階級立場(ui-btn-icon - pos )
<a href="#anylink" class="ui-btn ui-icon-search
ui-btn-icon-left" >Search</a>
注意：對於其他按鍵，就像在列表視圖和表單按鈕，你必須使用數據圖標屬性。 這將在後面的章節來解釋。
下面我們列出了一些可用的圖標jQuery Mobile的提供：
| Icon類 | 描述 | 圖標 | 例 |
|---|---|---|---|
| ui-icon-arrow-l | 左箭頭 | 嘗試一下 | |
| ui-icon-arrow-r | 右箭頭 | 嘗試一下 | |
| ui-icon-info | 信息 | 嘗試一下 | |
| ui-icon-delete | 刪除 | 嘗試一下 | |
| ui-icon-back | 背部 | 嘗試一下 | |
| ui-icon-audio | 音箱 | 嘗試一下 | |
| ui-icon-lock | 掛鎖 | 嘗試一下 | |
| ui-icon-search | 搜索 | 嘗試一下 | |
| ui-icon-alert | 警報 | 嘗試一下 | |
| ui-icon-grid | 格 | 嘗試一下 | |
| ui-icon-home | 家 | 嘗試一下 |
對於所有的jQuery Mobile的按鈕圖標的完整參考，請訪問我們的jQuery Mobile的圖標參考 。
定位圖標
您可以指定其中的圖標應該定位在按鈕四個值之一： top, right, bottom或left 。
使用ui-btn-icon類來指定位置：
圖標位置的鏈接按鈕
<a href="#anylink" class="ui-btn ui-icon-search ui-btn-icon-top" >Top</a>
<a href="#anylink"
class="ui-btn ui-icon-search ui-btn-icon-right" >Right</a>
<a href="#anylink"
class="ui-btn ui-icon-search ui-btn-icon-bottom" >Bottom</a>
<a href="#anylink"
class="ui-btn ui-icon-search ui-btn-icon-left" >Left</a>
試一試» 如果不指定鏈接按鈕圖標的位置，圖標將不顯示。
只顯示圖標
要只顯示圖標，使用"notext"作為圖標位置值：
卸下圈
默認情況下，所有的圖標會帶有灰色圓圈（光盤）。 要刪除這個圈子，加上"ui-nodisc-icon"類元素或其容器：
例
<a href="#anylink" class="ui-btn ui-icon-search
ui-btn-icon-left">With circle (default)</a>
<a href="#anylink" class="ui-btn ui-icon-search
ui-btn-icon-left ui-nodisc-icon" >Without circle</a>
試一試» 黑色或白色圖標
默認情況下，所有的圖標都是白色的。 若要更改圖標顏色為黑色，添加"ui-alt-icon"的元素或它的容器：
例
<a href="#anylink" class="ui-btn ui-icon-search
ui-btn-icon-left">White</a>
<a href="#anylink" class="ui-btn ui-icon-search
ui-btn-icon-left ui-alt-icon" >Black</a>
試一試» 更多示例
添加"ui-nodisc-icon"類的容器
的一個例子"ui-nodisc-icon"添加到容器類。
添加"ui-alt-icon"類的容器
的一個例子"ui-alt-icon"添加到容器類。