模糊时防止所选选项的颜色和背景颜色变化

Question

这是我的重点选择框：

而我的选择框，而模糊：

正如你可以看到，我选中的选框对应的选项以蓝色突出显示，而对于我模糊的选框，选定的选项以灰色突出显示。

---

这是我的HTML，如果有人需要它：

<select size='9' id="functions_select"> 
    <option>Option 1</option> 
    <option>Option 2</option> 
    <option selected>Option 3</option> 
</select> 

CSS：

* { 
    outline: none; 
} 

---

是否有可能使它这样，当模糊，所选择的选项我的选择框将保持蓝色？

Answer 1

我对你的解决方案：

* { 
 
    outline: none; 
 
} 
 

 

 
option:checked { 
 
    color: white; 
 
    -webkit-text-fill-color: white; 
 
    background: #1e90ff repeat url("http://i.stack.imgur.com/Istm3.jpg"); 
 
}

<select size='9' id="functions_select" multiple> 
 
    <option>Option 1</option> 
 
    <option>Option 2</option> 
 
    <option selected>Option 3</option> 
 
</select>

它使用background-image为option，这不会让浏览器使用default背景颜色。