まみやん技術メモ

仕事でためになった情報をこまめに書いていきます。

Androidの標準ブラウザでセレクトボックスを標準デザインに戻す方法

セレクトボックスは一度リセットCSSでリセットをしデザインをあてていたけれど、
説明文だけの画面とかお堅いところの画面では標準を使いたいということで、
元に戻す方法を模索していた。
ボーダーなどはさておき、プルダウンっぽい▼さえでれば問題なかったけれど、

をあててもなぜかAndroidの標準ブラウザだけそれっぽくならない。。
試行錯誤していたらやっとみつけたよ。。。


疲れたパトラッシュ....


input[type=search],
input[type|=checkbox],
input[type|=email],
input[type|=number],
input[type|=password],
input[type|=radio],
input[type|=text],
/*select,*/
textarea {
padding: 6px;
font-size: 15px;
background: #FFF no-repeat;
border-radius: 3px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
}


/*Androidのブラウザでデフォルトのデザイン表示用*/
.xxx select {
-webkit-appearance: menulist;
border: 1px solid;
border-image-source: initial;
border-image-slice: initial;
border-image-width: initial;
border-image-outset: initial;
border-image-repeat: initial;
}