Html 更改默认（禁用）选定选项的背景色

一般信息 尝试创建自定义设计的选择列表，其中第一个选项是默认选项，不应禁用该选项

问题 我可以更改可用选项的背景色，效果很好。但是，默认禁用选项在下拉列表中显示为灰色背景。将鼠标悬停在其上并再次移开后，颜色将更改为其应有的颜色

这似乎是使用选择和禁用选项组合时的一个特定问题。如果删除禁用和/或选定的属性，则问题消失

我将如何解决这个问题

我是如何试图解决这个问题的 我尝试根据以下问题更改选项的悬停颜色：

我想这可能与此有关。然而，这个问题的答案根本不起作用

我的代码：

身体{ 背景：41608c； } 挑选{ 字体系列：“源Sans-Pro”，无衬线； 字体大小：300； 字体大小：16px； 宽度：300px； 高度：64px； 背景：rgba0,0,0,0.4； 边界：无； 页边顶部：1px； 颜色：rgba255、255、255、1； 外观：无； } 选择选项{ 背景：rgba46,61,87,1； } 默认值 值1 价值2

---

若要在不编写脚本的情况下解决此问题，您不能将“禁用”用作默认选项。改为使用隐藏：

身体{ 背景：41608c； } 挑选{ 字体系列：“源Sans-Pro”，无衬线； 字体大小：300； 字体大小：16px； 宽度：300px； 高度：64px； 背景：rgba0,0,0,0.4； 边界：无； 页边顶部：1px； 颜色：rgba255、255、255、1； 外观：无； } 选择选项{ 背景：rgba46,61,87,1； } 默认值 值1 价值2

---

若要在不编写脚本的情况下解决此问题，您不能将“禁用”用作默认选项。改为使用隐藏：

身体{ 背景：41608c； } 挑选{ 字体系列：“源Sans-Pro”，无衬线； 字体大小：300； 字体大小：16px； 宽度：300px； 高度：64px； 背景：rgba0,0,0,0.4； 边界：无； 页边顶部：1px； 颜色：rgba255、255、255、1； 外观：无； } 选择选项{ 背景：rgba46,61,87,1； } 默认值 值1 价值2

---

您不应在同一选项上选择并禁用一个选项。如果您真的想阻止用户再次使用默认选项，您可以在更改时禁用它。这里有一个例子：@JensIngels谢谢。我知道如何解决这个问题。我甚至可以用标签来解决它。我只是想知道这是怎么发生的。有东西给禁用的选项一个默认的背景色。我最好的猜测是这是由操作系统完成的。但如果这是真的，那么为什么它在悬停选项后会自行修复呢？我开始怀疑这是否真的是浏览器与操作系统之间的一个bug。使用标签可能是你最好的选择。你不应该在同一个选项上选择并禁用一个选项。如果您真的想阻止用户再次使用默认选项，您可以在更改时禁用它。这里有一个例子：@JensIngels谢谢。我知道如何解决这个问题。我甚至可以用标签来解决它。我只是想知道这是怎么发生的。有东西给禁用的选项一个默认的背景色。我最好的猜测是这是由操作系统完成的。但如果这是真的，那么为什么它在悬停选项后会自行修复呢？我开始怀疑这是否真的是浏览器和操作系统的一个bug。使用标签可能是你最好的选择。谢谢，我将对此进行投票，因为这是一个解决问题的简单方法。但这并不是问题的答案，所以现在我将把它留待讨论。没问题，老实说，这个问题的确切答案将是使用这个系统来解决它的非设计用途。根据规则规定，不能在同一选项上同时使用禁用和选定选项。如果您试图以这种方式强制执行，则很可能会在生产中遇到错误。以下是有关如何进一步自定义select标记的更多信息。您可以使用必需的属性来防止用户不选择选项。遗憾的是，与输入不同，没有标准的验证事件为您显示无效消息。您确实可以访问生成它的布尔值。这里有一个例子：很好，LuckkalRight，将你的答案标记为已回答，因为你已经投入了足够的精力，公平地说，我的问题应该以不同的方式重新编写，以得到我想要的答案。再次感谢，我真的很感激！谢谢，我将对此进行投票，因为这是一个解决问题的简单方法。但这并不是问题的答案，所以现在我将把它留待讨论。没问题，老实说，这个问题的确切答案将是使用这个系统来解决它的非设计用途。根据规则规定，不能在同一选项上同时使用禁用和选定选项。很可能你可以

---

n如果您试图以这种方式强制执行，则会在生产中遇到错误。以下是有关如何进一步自定义select标记的更多信息。您可以使用必需的属性来防止用户不选择选项。遗憾的是，与输入不同，没有标准的验证事件为您显示无效消息。您确实可以访问生成它的布尔值。这里有一个例子：很好，LuckkalRight，将你的答案标记为已回答，因为你已经投入了足够的精力，公平地说，我的问题应该以不同的方式重新编写，以得到我想要的答案。再次感谢，我真的很感激！