optionタグの見た目をCSSで変更したい

Question

###前提・実現したいこと
optionタグの見た目をcssで
変更したいのですが、appearance: none;などを
やってもできないのでどなたか教えて頂けませんかー？

Comments

[m.ts10806]

どう変更したいんですか？

[kei344]

ご自身で試されたコードを質問文に追記し、「何をしたときに」「どうなると思って」「どうなったのか」、コードのどの部分で詰まっているのかなどを具体的に追記されたほうが回答が望めると思います。

Answer 1

optionタグということはselectタグの見た目を変えたいということでよろしいでしょうか？
appearance: button; を指定してからボーダーやフォントサイズを変更しましょう。

select {
-webkit-appearance: button;
-moz-appearance: button;
appearance: button;
padding:0.25em 0.5em;
font-size:1em;
line-height:1;
border:outset 2px #DDD;
background-color: #EEE;
background: linear-gradient(#FFF, #EEE);
background: -moz-linear-gradient(top, #FFF, #EEE);
background: -webkit-gradient(linear, left top, left bottom, from(#FFF), to(#EEE));
cursor:pointer;
}

ただし、ブラウザによって見栄えがかなり異なりますので注意してください。
テキストの後ろに上下マークが出るブラウザと出ないブラウザがあります。
どこかで妥協する必要があると思います。