jQuery Mobile：如何自定義按鈕

Question

如何將<a data-role="button">按鈕的背景更改爲我的圖片？另外，我怎樣才能將我的自定義圖標添加到左側按鈕的頂部？

Answer 1

給鏈接一個類並使用CSS更改背景圖像。

<a data-role="button" class="my-button"> 

...

.my-button { 
    background-image: url('images/my-button.png') !important; 
} 

Answer 2

我要說的是定製jQuery Mobile的按鈕，推薦的方法是添加自定義的主題。

<a data-role="button" data-theme="my-site">Button</a> 

這會讓您更好地控制按鈕的不同元素和狀態。例如，你可以通過編寫與您的自定義主題名稱相關聯的類的代碼（它們會自動添加到按鈕）目標在CSS按鈕的不同狀態：

.ui-btn-up-my-site { /* your code here */ } 
.ui-btn-hover-my-site { /* your code here */ } 
.ui-btn-down-my-site { /* your code here */ } 

請記住，默認按鈕是由邊框，陰影，當然還有背景漸變。此外，按鈕中還有其他HTML元素由框架自動生成。根據您想要自定義的內容，您可能需要將按鈕中的其他類（ui-icon，ui-btn-text，ui-btn-inner等）作爲目標。

這裏是一個教程，解釋如何做jQuery Mobile按鈕的高級自定義。該文章顯示瞭如何做一些基本的自定義，如何重置jQuery Mobile的主題，以及如何將默認按鈕到任何你想要的：

http://appcropolis.com/blog/advanced-customization-jquery-mobile-buttons/