无法在移动版Safari / Chrome上为SELECT OPTION设置CSS样式

Question

我只希望option文字为大写。

在移动设备上使用Chrome或Safari，请转到：http://jsfiddle.net/justincook/SAm7Q/

我尝试过以下方法但没有成功：

<style>
select, select option {
    text-transform: uppercase;
    -webkit-appearance:none;
}
</style>
<select>
    <option>- select -</option>
    <option>make me caps</option>
</select>

似乎iOS不允许select option的任何样式，任何方式？ Android的行为也是这样吗？

Answer 1

我刚刚在Chrome for Android上进行过测试，所有内容都是全部大写，但是，Android浏览器显示的选项为小写。

您可以使用Javascript转换字符，而不是依赖CSS，这样的内容应该适用于所有移动平台：

var option = document.getElementsByTagName('option');
option.text = option.text.toUpperCase();