Question

html select 改变选项字体颜色 <option value='' style="

html select 改变选项字体颜色
<option value='' style="color:#03b2eb">2222</option>
在pc端有效，但在移动端手机浏览器上无效怎么办

Answer 1

html  select  改变选项字体颜色
<option  value=''  style="color:#03b2eb">2222</option>，

可以直接在给每个option上加上class，然后class定义属性color属性。或者是直接写在每个option上style="color:black"

例如:加class
<style>
.volvo{color: blue;}
.saab{color: red;}
</style>
<select>
<option class="volvo">Volvo</option>
<option class="saab" >Saab</option>
<option class="volvo">Opel</option>
<option class="saab" >Audi</option>
</select>
加style:

<select>
<option style="color:red">Volvo</option>
<option style="color:blue" >Saab</option>
<option  style="color:blue;font-size:18px">Opel</option>
<option style="color:green">Audi</option>
</select>
还有一种方法就是使用javascript或者jquery动态修改。
例如jquery可以利用选择器。addClass("volvo").

Answer 2

可以直接在给每个option上加上class，然后class定义属性color属性。或者是直接写在每个option上style="color:black"也可以
例如:加class
<style>
.volvo{color: blue;}
.saab{color: red;}
</style>
<select>
<option class="volvo">Volvo</option>
<option class="saab" >Saab</option>
<option class="volvo">Opel</option>
<option class="saab" >Audi</option>
</select>
加style:

<select>
<option style="color:red">Volvo</option>
<option style="color:blue" >Saab</option>
<option style="color:blue;font-size:18px">Opel</option>
<option style="color:green">Audi</option>
</select>
还有一种方法就是使用javascript或者jquery动态修改。
例如jquery可以利用选择器。addClass("volvo").

追问

我就是用的加style的方法，但移动端不起作用哦，pc是可以

移动端就是不能控制option的样式了吗

Answer 3

应该是手机浏览器版本的原因，你在手机上下载一个谷歌浏览器试试。。。

追问

不行呀，不是所有的人都用谷歌呀，一般手机都用qq浏览器或uc吧

追答

那这就不好搞了，你写代码的时候得考虑兼容性问题，去网上找找前台样式怎么兼容到手机qq浏览器，或者你写前台ui的时候用一些支持手机端ui设计的框架，这样比较方便点