CSS：选择的伪类类似于：checked，但是对于<select>元素

Question

CSS：选择的伪类类似于：checked，但是对于<select>元素

有没有办法在<option>元素中设置当前所选元素的样式<select>？

然后，我可以为当前选定的选项元素提供背景颜色？这样我就可以设置当前在封闭下拉列表中可见的选项。

Answer 1

实际上，您只能设置几个CSS属性：修改后的选项元素。&nbsp;color也不起作用，background-color但你可以设置一个background-image。你可以将它与渐变结合起来来做到这一点。option:hover,option:focus,option:active,option:checked&nbsp;{ &nbsp;&nbsp;background:&nbsp;linear-gradient(#5A2569,&nbsp;#5A2569);}<select> &nbsp;&nbsp;<option>A</option> &nbsp;&nbsp;<option>B</option> &nbsp;&nbsp;<option>C</option></select>适用于gecko / webkit。

Answer 2

这对我有用：select&nbsp;option&nbsp;{ &nbsp;&nbsp;&nbsp;color:&nbsp;black;}select:not(:checked)&nbsp;{ &nbsp;&nbsp;&nbsp;color:&nbsp;gray;}