html - CSS3 Filter 可以应用于 <select> 内的选项吗？

Question

我想在打开时模糊选择下拉列表中的选项。我可以模糊选定的选项，但不能模糊其中的选项。

select option {
    -webkit-filter: blur(5px); 
    filter: blur(5px);
}

这是一个代码笔来测试:

https://codepen.io/santalurr/pen/LLVWBB

Answer 1

你可以在类名后使用:hover:

select option:hover {
    -webkit-filter: blur(5px); 
    filter: blur(5px);
    color: blue; /* Just checking if rule and styles are working */
}