2011-06-23 18 views
2

私はjQuery Mobileフォーム入力のスタイルを変更しようとしています& textareas。今、彼らはこのようなカスタム来jQueryモバイル入力とテキストエリアカスタムスタイル

http://jquerymobile.com/demos/1.0b1/#/demos/1.0b1/docs/forms/forms-text.html

HIは無い丸いエッジでそれらを自分自身のスタイルを設定します。

input { 
width:100%; 
height: 40px; 
border: 0px !important; 
border-bottom: 1px solid !important; 
border-bottom-color: #ccc !important; 
-moz-border-radius: 0px !important; 
-khtml-border-radius: 0px !important; 
-webkit-border-radius: 0px !important; 
border-radius: 0px !important;} 

#overheard textarea { 
width:100%; 
height: 100px !important; 
border: 0px !important; 
-moz-border-radius: 0px !important; 
-khtml-border-radius: 0px !important; 
-webkit-border-radius: 0px !important; 
border-radius: 0px !important;} 

しかし、私は物事のカップルが把握することはできませんされています:私は取り除くことはできませんテキストエリアに

  1. を私は新しいスタイルシートを追加し、追加することでこれを解決しています内側の影
  2. フィールド上をクリックしたときのテキストエリアと入力の両方に、外側のシャドウが表示されます。私はjQuery MobileのCSSや.jsのどこから来ているのかわかりません。何か案は?

答えて

2

内側の影は.ui-shadow-insetからの-webkit-box-shadow(少なくともWebKitの場合)です。外側の「影」はほぼ確実にoutline propertyです。 outlineは一般的にブラウザのデフォルトのスタイルシートに由来します。両方ともに設定するnone

-webkit-box-shadow: none; 
outline: none; 

私の両方の効果を取り除きます。お気軽に他のブラウザに-webkit-box-shadowを移植する必要がありますが、否定する必要があるものは.ui-shadow-insetをご覧ください。

関連する問題