在 Chrome 中禁用 <select> 样式答案

【问题标题】：Styling disabled <select> in Chrome在 Chrome 中禁用 <select> 样式
【发布时间】：2011-11-29 15:58:37
【问题描述】：

对于我使用的样式禁用元素：

[disabled] { /* Text and background colour, medium red on light yellow */
color:#933;
background-color:#ffc;
}

它在除 Chrome 之外的所有浏览器中都能完美运行。有没有办法在没有类的情况下使用 css 来克服这个问题，因为我在不同的页面上有大量元素并且不想全部更改。

提前致谢。

更新

经过一番调查，我意识到只有当客户端具有像 Windows 2008 这样的服务器操作系统并且只使用 Chrome 浏览器时，才能重现这种情况。但我希望它是现实生活中的一个后方条件。

【问题讨论】：

您是否尝试过使用[disabled="disabled"]？
谢谢。不幸的是，它也不起作用。
您是否尝试过使用内联样式或自定义 CSS 类来设置禁用元素的样式以确保它甚至可以设置禁用元素的样式？

标签： html css google-chrome

【解决方案1】：

使用 Chrome 15 似乎可以正常工作。

input[disabled] {
  color: #933;
  background-color: #ffc;
}

确保您已清除所有缓存的样式表。

创建了一个jsFiddle。

更新

注意到您的问题标题并更新了示例。

这似乎是 Windows 中 Chrome 的一个已知问题，请参阅 Style disabled multiple select – google chrome

【讨论】：

谢谢，它运行良好，但它取决于服务器操作系统。在我的本地 Windows 7 上它可以工作，但在服务器 Windows 2008 上它不起作用。
对我来说，它适用于 Windows 7，但不适用于 Windows XP。我回答你的问题了吗？ :)
是的，我认为您的回答最接近解决方案。非常感谢。

【解决方案2】：

下面的代码对我有用（样式选项颜色不是选择框本身）：

<select multiple="multiple" disabled="disabled">
<option style="color:#CCCCCC;" value="1" selected>Monday</option>
<option style="color:#CCCCCC;" value="2" selected>Tuesday</option>
<option style="color:#CCCCCC;" value="3">Wednesday</option>
<option style="color:#CCCCCC;" value="4">Thursday</option>
<option style="color:#CCCCCC;" value="5">Friday</option>
<option style="color:#CCCCCC;" value="6">Saturday</option>
<option style="color:#CCCCCC;" value="7">Sunday</option>
</select>

【讨论】：

感谢 Orhun Alp Oral，但对于现代版本的 Chrome 来说，这似乎根本不是问题。
这个在IE中好像不行，但是我可以在IE中设置背景色，也解决了我的问题。