html - 如何更改 Google Chrome 中 <option> 元素的背景颜色？

我在为 <select> 中的选项设置背景颜色(和文本颜色)时遇到问题在 Google Chrome 中列出。

似乎在 Firefox 中运行良好:

但不是在谷歌浏览器中:

关闭:

打开:

代码:

<html>
<head>
    <style>
        select
        {
            background:yellow!important;
        }
        option
        {
            background:red!important;
        }
        .c1
        {
            background-color:green!important;
            color:red!important;
        }
    </style>
</head>
<body>

<select>
    <option class="c1">nice long option name</option>
    <option class="c2">nice long option name</option>
    <option class="c3">nice long option name</option>
    <option class="c4">nice long option name</option>
    <option class="c5">nice long option name</option>
</select>

</body>
</html>

我想知道谷歌浏览器是否使用它自己的元素或主机操作系统的元素来呈现选择框，也许这就是它不起作用的原因？也许这是一件好事，因为这些颜色看起来相当可怕，但如果 Chrome 提供更多控制就更好了。

最佳答案

尝试: 选择 { -webkit 外观:无；

也许这对你有帮助。

如果不是...那么 Chrome 可能不支持它。

关于html - 如何更改 Google Chrome 中 <option> 元素的背景颜色？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/9197992/