如何在不使用主題滾輪的情況下使用jQuery按鈕類自定義按鈕？

Question

我是jQuery Mobile的新手，我試圖弄清楚如何自定義按鈕。我必須使用哪些類來訪問某些CSS屬性？

例如我知道如果你想改變一個按鈕的背景顏色，你可以寫.ui-btn-inner {background: white;}。但是當我這樣做的時候，它一直沒有成功。

我已經看過jQuery Mobile API網站，但我似乎無法找到任何可以深入解釋這個概念的東西。

如果有人可以提供給我一個網站或關於這些類的解釋，將不勝感激。

Answer 1

您可以檢查html以查看jQuery移動按鈕的外觀。 對於基本按鈕，創建人：

<a href="index.html" data-role="button">Link button</a> 

輸出的樣子：

<a href="index.html" data-role="button" data-corners="true" data-shadow="true" data-iconshadow="true" data-wrapperels="span" data-theme="c" class="ui-btn ui-shadow ui-btn-corner-all ui-btn-up-c"> 
    <span class="ui-btn-inner ui-btn-corner-all"> 
     <span class="ui-btn-text">Link button</span> 
    </span> 
</a> 

創建和了jQuery移動後的CSS加載自定義CSS文件。 在這裏，您可以覆蓋各個CSS類，像

.ui-btn-inner { 
    // !important does the trick 
    background-color: #FF0 !important; 
    ... 
} 

有時你可能必須添加!important的CSS以覆蓋的jQuery移動CSS。但我真的不知道什麼時候這是必要的，我只是這樣做，如果它不工作沒有...

您可以查看jQuery手機CSS中的所有元素的結構，或者，正如我前面提到的，使用Web檢查器來查看jQuery將標記轉換爲什麼內容。

一個深入瞭解更多如何在CSS的作品，提供了PS here