好的，你不能在选择选项的时候改变悬停颜色通过操作系统而不是HTML，但你的第二个解决蓝色轮廓的答案如下：

添加 outline：none 到您的CSS：

  .contactselect select 
 {
 background：url（Images / ArrowO.png ）不重复权利＃000; 
 width：268px; 
 padding：5px; 
颜色：＃F7921C; 
 font-size：25px; 
 font-family：dumbledor; 
 line-height：1; 
 border：solid 4px＃F7921C; 
 border-radius：10px; 
 height：45px; 
 -webkit-appearance：none; 
概述：无; 
} 
 

这是 JS小提琴演示。

I have a customized drop down menu box (see picture) I want to change the highlight color on the options to get rid of the horrible blue and change it to a color of my choice, I would also like to stop the blue highlight box around the whole thing and remove the border from the options box. How do I go about removing any or all of these?

Thanks

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;
}

Well you cannot change the hover color of select option as it is rendered by Operating System instead of HTML however your second answer for removing the blue outline is as under:

Add outline:none to your 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;
}

Here is the JS Fiddle Demo .