更改选择框中所选选项的背景颜色

时间:2011-02-23 10:11:24

标签: html css select background

enter image description here

我必须创建一个这样的选择框。我已经能够使用optgroup获得此树结构,但是我在将所选选项的默认背景颜色从默认颜色更改为此橙色时遇到问题。 我知道js解决方案,但我对纯HTML / CSS解决方案更感兴趣。如果它能在每个浏览器中运行会更好,但没有压力;)

提前致谢。

2 个答案:

答案 0 :(得分:6)

使用HTML / CSS无法做到这一点。 select元素的颜色是特定于操作系统的,因此无法使用CSS或HTML进行更改。已经开发了Javascript解决方案,它们(到目前为止)是唯一的方法:)

答案 1 :(得分:3)

在Firefox中,你可以使用css background-image属性和:checked CSS伪类选择器来实现它。

option:checked, option:hover {
    color: white;
    background: #488f8f repeat url("mycolor.gif");
}

您可以在我的网站www.speich.net

上找到不同颜色的css demo