预选选项在页面加载时突出显示为灰色，希望它为蓝色

问题描述

例如，当您使用此代码转到下面的页面时，加载选项之一被选中并且背景颜色为灰色。当我点击它时它变成蓝色。我怎么能在页面加载时让它变成蓝色，而不是灰色。

<select class="select" multiple="multiple" id="select_id">
<option selected>option one</option>
<option>option 2</option>
<option>option 3</option>
</select>

解决方法

您可以像这样覆盖所选值的背景颜色：

select option:checked{ 
  background: lightgreen -webkit-linear-gradient(bottom,lightgreen 0%,lightgreen 100%);
}

<select class="select" multiple="multiple" id="select_id">
    <option selected>option one</option>
    <option>option 2</option>
    <option>option 3</option>
  </select>