Html 更改选定多选项的颜色

我在页面上有一个

多选

元素：

<select multiple="multiple">
  <option>One</option>
  <option>Two</option>
  <option>Three</option>
</select>

一个
两个
三

它的颜色是黑色。但当我选择一个选项时，它的颜色会变成白色

如何使用css将所选选项的颜色更改为黑色（或其他我想要的颜色）

我试着用

• 选择选项：活动

• 选择选项：选中

• 选择选项：焦点

• 选择选项：悬停

但他们没有做到这一点

UPD：

---

以下是我需要的JSF摘要：

我不知道如何仅在CSS中实现这一点，但我知道您可以使用CSS选择所选选项

我的建议是使用jQuery更新所选选项的属性，然后更改CSS规则

[selected]

，以放置您喜欢的背景色

下面是一个运行示例：

$（文档）.ready（函数（）{
$（'select'）.change（函数（）{
var selectedOption=$（this.find（“：selected”）；
selectedOption.attr（'selected'，'selected'）；
}).change（）；
});
选择{高度：200px；宽度：300px；}
选项{边距：10px；}
[选定]{
背景色：#0f0；
字体大小：粗体；
}

一个
两个
三
四
五
我不知道如何仅在CSS中实现这一点，但我知道您可以使用CSS选择所选选项

我的建议是使用jQuery更新所选选项的属性，然后更改CSS规则
[selected]
，以放置您喜欢的背景色

下面是一个运行示例：


$（文档）.ready（函数（）{
$（'select'）.change（函数（）{
var selectedOption=$（this.find（“：selected”）；
selectedOption.attr（'selected'，'selected'）；
}).change（）；
});
选择{高度：200px；宽度：300px；}
选项{边距：10px；}
[选定]{
背景色：#0f0；
字体大小：粗体；
}

一个
两个
三
四
五
@Pete如果我理解你的话，这里没有太多的代码correctly@Pete这里没有太多代码，如果我理解正确的话，这不是我需要的行为。我希望选项颜色在当前选中时为黑色。而您无法通过执行
[selected]{background color:#000；}
？您的代码执行以下操作：我选择选项（背景颜色为深蓝色，选项文本颜色为白色）；我选择了另一个选项（此选项背景颜色为深蓝色，此选项文本颜色为白色），但先前选项的背景变为绿色。我想要以下行为：当我选择该选项时（当它被选中时），它的背景应该保持深蓝色，选项文本颜色应该是黑色（或其他颜色），但现在它是白色。当我更改为
[selected]{background color:#000；}
时，背景颜色只会变为黑色，但不是选项的文本。我已经用JSFIDLE更新了我的问题，其中alert告诉我何时需要黑色。这不是我需要的行为。我希望选项颜色在当前选中时为黑色。而您无法通过执行
[selected]{background color:#000；}
？您的代码执行以下操作：我选择选项（背景颜色为深蓝色，选项文本颜色为白色）；我选择了另一个选项（此选项背景颜色为深蓝色，此选项文本颜色为白色），但先前选项的背景变为绿色。我想要以下行为：当我选择该选项时（当它被选中时），它的背景应该保持深蓝色，选项文本颜色应该是黑色（或其他颜色），但现在它是白色。当我更改为
[selected]{background color:#000；}
时，背景颜色只会变为黑色，但不是选项的文本。我已经用JSFIDLE更新了我的问题，其中alert告诉我何时需要黑色。