如何更改 FireFox 中悬停选择选项的颜色
我想更改 FireFox 中悬停的选择选项的颜色，它具有默认的蓝色背景和白色前景。
我试过：
<select name="select" size="1">
<option>0</option>
<option class="test">1</option>
<option>2</option>
<option>3</option>
<option>4</option>
</select>
.test:hover {
color:green;
background-color:yellow;
text-decoration:underline;
}
但这不起作用。请参阅示例。
FireFox 特定的解决方案就足够了。
I want to change the Color of the hovered Select-Option in FireFox which has default blue background and white foreground.
I tried:
<select name="select" size="1">
<option>0</option>
<option class="test">1</option>
<option>2</option>
<option>3</option>
<option>4</option>
</select>
.test:hover {
color:green;
background-color:yellow;
text-decoration:underline;
}
But it doesn't work. See Example.
A FireFox specific solution is sufficient.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（4）
SELECT元素由操作系统呈现，而不是 HTML。您无法设置此元素的样式。不过，您可以使用 JavaScript 来使用 HTML+CSS 替代品来模拟 SELECT。
SELECTelements are rendered by the OS, not HTML. You cannot style this element.You can use a HTML+CSS replacement using JavaScript to simulate SELECT though.
仅靠 CSS 是无法完成的。我推荐 jQuery + 选择插件替换
It cannot be done with CSS alone. I recommend a jQuery + Chosen plugin replacement for the
<select>我发现我可以将图像设置为背景。
jsfiddle demo
但它只画在 :hover 上，当我从选项中退出鼠标时将由系统渲染。
I found out that I can set an Image as Backround.
jsfiddle demo
But it is only painted on :hover, when I exit the mouse from the option it will by system rendered.
我认为你可能需要像这样使用 CSS 组合器：
基本上你是在指定：
Parent >孩子们 。 class : event
select 标签中的所有子项，其中带有“.test”类的选项将具有括号中指定的样式。
重要提示：它适用于 Firefox，但不适用于 Chrome。
以下参考可以帮助您： http://www.w3schools.com/css/css_combinators.asp< /a>
I think you may need to work with CSS combinators like this:
Basically you are specifying this:
Parent > children . class : event
All children in select tags inside which options with the class ".test" will have the style specified in brackets.
IMPORTANT: It works on Firefox, but not in Chrome.
Here's a reference can help you: http://www.w3schools.com/css/css_combinators.asp