Question

以下代码突出显示了Google Chrome中的所选选项

<!DOCTYPE html>
<html>
<head>
<style>
    select option:checked { background: #f00; }
</style>
</head>
<body>

<select>
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="opel">Opel</option>
<option value="audi">Audi</option>
</select>

</body>
</html>

然而它在Mozilla Firefox中不起作用！

关于使用相同的行为的CSS的任何想法都适用于Firefox？

Answer 1

再次你不能使用背景颜色，我尝试过背景：线性渐变（..），它在ff中对我有效。

option:hover,
option:focus,
option:active,
select option:checked {
  background: linear-gradient(#5A2569, #5A2569);
}

Answer 2

尝试：选项[选中] {背景：＃f00; }

如何在Firefox中使用CSS为用户选择的选项着色

2 个答案: