如何在选择/选项下拉菜单中删除蓝色背景以进行焦点/悬停

Question

当激活某个选项并在我的选择下拉菜单中将鼠标悬停在一个选项上时，如何去除蓝色背景。

以下是我的意思的屏幕截图：

我尝试了所有可以简化的css规则，甚至搜索了Internet，包括此处，但没有任何作用

.language {
  float: right;
  margin-top: -45px;
  padding-right: 25px;
}

.language select {
  width: 180px;
  border: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  text-indent: 1px;
  text-overflow: '';
  cursor: pointer;
}

.language select::-ms-expand {
  display: none;
}

.language option {
  background-color: #000;
  color: #fff;
}

.language option:hover {
  background-color: #000;
  color: #fff;
}

.language-selector::before {
  font-family: "Font Awesome 5 Free";
  content: "\f0ac";
  visibility: visible;
  font-weight: 900;
  position: relative;
  float: left;
  margin-left: 1690px;
  margin-top: -53px;
}

<div class="language">
  <select>
    <option value="">English</option>
    <option value="">Deutsch</option>
  </select>
</div>

Answer 1

好吧，你不能。这是由操作系统设置的。抱歉：/

Answer 2

尝试一下

:focus {outline:0 !important;}

还有这个

:hover {outline:0 !important;}

如果这不起作用，请尝试使用您自己的CSS样式！重要的是，这将覆盖所有标准CSS

祝你好运：）

Answer 3

通常，您会使用background: transparent，但是您必须告诉我们设置蓝色的规则，或者是其他人提到的是OS /浏览器，请告诉我们哪个OS /浏览器。下拉式属性的样式不一定总是由浏览器设置的（请参阅Firefox和Chrome中它们之间的区别）。不幸的是，完整样式控制的解决方案是使用触发器和可切换可见性并处理用户选择的项目列表来创建自己的下拉菜单。