您如何设置或覆盖下拉菜单的默认悬停颜色？答案

【问题标题】：How do you style or override the default hover color for drop down menus?您如何设置或覆盖下拉菜单的默认悬停颜色？
【发布时间】：2012-10-12 11:18:32
【问题描述】：

我知道，不知何故，你可以做到这一点。我只是不确定。我希望覆盖选择菜单（下拉菜单）的默认蓝色悬停，以便我可以在我的选项中添加一个 box-shadow: inset 0 0 3px 3px。

那么，JavaScript、JQuery、（最好）CSS？

我对 JavaScrip 和 JQuery 知之甚少...我还没有做到这一点，但是对于这个问题的任何帮助将不胜感激。

谢谢！

http://lrroberts0122.github.com/DWS/lab6/level-1/

【问题讨论】：

我认为您无法更改选择元素的选项元素的悬停颜色。您可以考虑改用 UL 并根据需要设置 LI 元素的样式。
@BillyMoat：您应该将其发布为答案并添加一个小代码示例。我会点击那个。

标签： javascript jquery css drop-down-menu

【解决方案1】：

并非每个浏览器都允许这样做。事实上，如果您在 chrome 中查看您的网站，您会发现选择框本身甚至没有显示灰色背景。导致白色背景上的白色文本。如果您真的想自己设置下拉菜单的样式，我建议您使用 javascript/jquery 将 select/option 替换为 ul/li，您可以根据需要设置样式。

我将尝试找到一些示例来帮助您入门。等一下。

编辑：这应该让你开始：http://tutorialzine.com/2010/11/better-select-jquery-css3/

edit2：这是另一个：http://bnotions.com/form-select-replacement-using-jquery-css/

而且这个人甚至创建了一个插件：http://forrst.com/posts/jQuery_plugin_ReplaceDropdown_to_replace_a_selec-NA2

免责声明：我自己没有测试过上面的任何链接。因此，请自行决定使用。

【讨论】：

适用于 FF，但不适用于我的 Chrome - 你是不是弄错了？
对不起。是的，这就是我想说的。在 Firefox 中很好，在 chrome 中白底白字
它不是为 Chrome 设计的。为此，我只需要为 Firefox 设置样式。
bnotions.com/form-select-replacement-using-jquery-css 这个教程真的很不错！谢谢！ :)

【解决方案2】：

我发现投递箱的属性在 #103 到 #114 行。请更全面地解释您的答案，例如在方框 BORDER 本身或文本中，而您不想在它后面有任何东西？

【讨论】：

【解决方案3】：

使用 jquery 的 unbind() 函数取消绑定悬停，然后尝试通过 .css() 再次绑定，您应该可以更改

【讨论】：