我可以在HTML中选择选项的背景颜色选择CSS选项吗？ [英] Can I colour backgrounds of selected items in HTML select options with CSS only?

问题描述

我搜索过很多，看到人们提出：

I've searched around a lot and see people suggesting that:

::-moz-selection {background: red;}
::selection {background: red; }

..用于在多选表单项目中为当前选定项目的背景着色。 （注意：我的意思是选择的项目，而不是有焦点的项目）。

..works for colouring the background of the currently selected items in a multiple select form item. (Note: I mean the selected items, not the items with focus).

我无法使这个工作。我这样做错了吗？

I can't get this to work. Am I doing it wrong?

#dropdowns select::selection {
    background: red;
}

干杯：/

设置：使用Chrome for Mac

Setup: Using Chrome for Mac

推荐答案

:: selection 不适用于选定的选项;它适用于突出显示的文本。

::selection doesn't apply to selected options; it applies to highlighted text. Either you're misinterpreting their suggestions, or what they said is flat-out wrong.

根据这个答案，你应该能够使用选项：checked 来设置所选项目的样式：

According to this answer, you're supposed to be able to use option:checked for styling the selected items:

#dropdowns option:checked {
    background: red;
}

但我无法让它工作< select> 或< select multiple> 元素这个测试fiddle 。

But I haven't been able to get it to work for <select> or <select multiple> elements in this test fiddle.

这篇关于我可以在HTML中选择选项的背景颜色选择CSS选项吗？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！