选择框CSS和HTML的样式

Question

有人刚刚帮我删除了选择框的轮廓(从我的第一个bootstrap-django项目中)，现在，我想请求您的帮助来更改选项框本身的边框颜色属性，它是蓝色的，我正在尝试将其设置为黄色。此外，由于某些原因，当选择框具有默认值时，它的边框是黄色的，但在您选择其中一个选项后，它变得更暗，我希望它从乞讨开始变得更暗。

这是我的CSS：

.selector{
    outline:none;
    position:absolute;
    border-radius:1rem;
    margin-left:260px;
    width:500px;
    border-color: #C9C9C9;
    height:35px;
    font-size: 15px;
    text-align-last: center;
    color:#C9C9C9;
}

.selector:focus{
    border-color:#FFD700;
    box-shadow: 0 0 8px #FFD700;
}

和我的HTML：

<div class="div1">
  <label for="estado" class="label1">
    Estado
    <select class="selector" id="estado" name="estado" onchange="functionfs()" style="border-color: #C9C9C9; ">
      <option style="color:black" selected="selected" value="-----">--- Ingrese un valor ---</option>
      <option value="Activo" style="color:black;">Activo</option>
      <option value="Inactivo" style="color:black;">Inactivo</option>
    </select>
  </label>
</div>

还有我的JS：

<script type="text/javascript">
  var selector = document.getElementById("estado");
  function functionfs(valor) {
    selector.setAttribute("style", "color:black;");
  }
</script>

我也会附上2个图像的问题本身。

​

​

​

​

正如您所看到的，当我选择两个状态中的一个并再次单击它时，它变得更暗。

谢谢大家！

Answer 1

下面是你的暗色和发光问题的解决方案：

代码选择器类

  . selector {
    outline: none;
    position: absolute;
    border-radius: 1rem;
    margin-left: 260px;
    width: 500px;
    height: 35px;
    font-size: 15px;
    text-align-last: center;
    color: #000000;
    border-color: #FFD700 !important;
    box-shadow: 0 0 8px #FFD700;
}

而蓝色边框不能更改，因为它是由操作系统呈现的

You can see here