html5+jQuery Mobile開發移動端wap經驗總結（二）- a / input樣式重新定義

標籤：html5   jquery mobile   wap   

jQuery mobile中，很多樣式都是寫好的，雖然有主題，但是對於個人化的wap網站來說，還是很難駕馭的。

使用html5+jQuery Mobile做了幾個頁面之後，中間所遇到的問題，以及解決方案，現在加以總結，以便過後查閱。

問題：

1、a的顏色重新定義問題

2、input中button顏色問題、

       input輸入框中，左邊表徵圖展示問題（文字縮排）

3、上文中的表徵圖自訂問題【上文已經說明，通過ui-icon-XXX:after進行重新定義】

解決：

1-2、a / input的重新定義均可使用

.ui-page-theme-a a.c_hot_60{ color:#ff6600;}

.ui-page-theme-a input.btn-green{ background: url(../images/btn_green.png) no-repeat; background-size: 100% 100%;}

註：在標籤中，添加相應class，同時需要標註主題，例如<a href="#" data-theme="ui-page-theme-s" class="c-hot-f60 fr">新使用者註冊</a>。input使用方法同此一致。

如果不需要標註主題，直接寫input.ti_3{ text-indent:3em;}也可以。

html5+jQuery Mobile開發移動端wap經驗總結（二）- a / input樣式重新定義