Question

我知道我在那里使用了很多选词...抱歉。

无论如何，我正在寻找一个CSS选择器，我可以用它来识别页面上没有选择的HTML Select元素，这样我就可以突出显示它们，以便用户知道那些元素仍然需要完成。我有一个空选项作为选择中的第一个元素，所以如果这有帮助...请使用它。

到目前为止我的愚蠢尝试：选择：空选择[的selectedIndex = “0”]

<select>
  <option value="" />
  <option value="real selection" />
<select>

基本上，我想找到所有未选择选项的选项，选择的值为0，或选择的索引为0.（这些在我的场景中是等效的）。通过这种方式，我可以突出显示屏幕上的内容，让用户知道，“嘿，你还有更多工作要做。”

仅供参考：Psuedo和CSS3选择器也适用于这种情况。

Answer 1

这在CSS 3中是不可能的。

当支持选择器级别4时（假设此位没有更改），您可以determine the subject of the selector不是选择器中的最后一项，并且：

select {
    /* Default. Put non-selected styles here */
}

!select > option + option:checked {
    /* An option following another option (so not the first option) is selected */
}

如果要处理optgroup元素，则需要使选择器更复杂。

SELECT html元素的CSS选择器，未选中任何内容

1 个答案: