selectbox 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>

我还将附上问题本身的两张图像。

如您所见，当我选择两个状态之一并再次单击它时，它会变暗。

谢谢大家！

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