Html 更改“选择”高亮显示颜色

我有一个定制的下拉菜单框查看图片我想更改选项上的高光颜色以去除可怕的蓝色并将其更改为我选择的颜色，我还想停止整个项目周围的蓝色高光框，并从选项框中删除边框。我该如何移除其中任何一个或全部

谢谢

htmlcode:
<div class="contactselect"><select id="contactdropdown">
<option value="Email">Email Form</option>
<option value="Website">Website Form</option>
<option value="Creation">Creation Form</option></select>
</div>

csscode:
.contactselect select{
   background: url(Images/ArrowO.png) no-repeat right #000;
   width:268px;
   padding:5px;
   color:#F7921C;
   font-size:25px;
   font-family:dumbledor;
   line-height:1;
   border:solid 4px #F7921C;
   border-radius:10px;
   height:45px;
   -webkit-appearance:none;
}

---

在Firefox中，默认样式表是

option:checked {
    background-color: -moz-html-cellhighlight !important;
    color: -moz-html-cellhighlighttext !important;
}

问题是，即使使用了，也无法覆盖内部重要属性！重要的

所以，基本上，你不能，除非你实现你自己的UI

---

编辑：在某些浏览器上，您可以使用。

如果您想要在没有jQuery或其他框架的情况下实现任何类型的兼容性，这是不可能的。试着调查一下。大多数插件都允许您自定义下拉框的样式和外观

您不能更改select选项的悬停颜色，因为它是由操作系统而不是HTML呈现的，但是您删除蓝色轮廓的第二个答案如下所示：

将大纲：无添加到css：

.contactselect select
{
   background: url(Images/ArrowO.png) no-repeat right #000;
   width:268px;
   padding:5px;
   color:#F7921C;
   font-size:25px;
   font-family:dumbledor;
   line-height:1;
   border:solid 4px #F7921C;
   border-radius:10px;
   height:45px;
   -webkit-appearance:none;
    outline: none;
}

---

以下是。

HTML将始终限制您更改悬停颜色，并且它将限制更改按钮。因此，您必须在jQuery或Javascript的帮助下对其进行更改，因此请参阅我随附的这把小提琴：

在这里，您可以通过更改css来更改所有需要的内容

---

否则，由于你已经发布了一张图片，所以没有选项更改背景颜色和按钮，我建议使用Photoshop。如果你想在代码中更改它，请显示你的代码。这个下拉列表是如何构造的？只要这是一个常规的下拉列表，突出显示的颜色就不能改变。这不是单用CSS就可以改变的。您必须将下拉列表重组为一个或使用Javascript/Jquery库/pluginI来添加我的代码。这是一个常规的下拉菜单。在这种情况下建议使用什么插件？在使用之前，我会先看一看。Lol@JordanThompson不，我没告诉你要用那个密码。这是Firefox内部样式表的一部分。由于我似乎无法在本地更改高亮颜色，我将研究一些插件，我接受你的回答，因为它解决了周围的蓝色框。ThanksIt不起作用…@i'myourhuckleberry它在safari、chrome和firefox中起作用。我不知道你在用什么。检查小提琴。它甚至在小提琴上都不起作用。我使用windows和最新版本的chrome。我使用第三方jquery插件以另一种方式解决了这个问题。我认为没有javascript是不可能的。我假设您使用Mac rich guy…您可以在CSS选择框中设置按钮的样式，但是，很可能是因为它们的复杂性，您从未有过超出主容器边界的样式。