如何在Select的<option>标签内添加不同颜色的文本？

Question

我尝试过内联但没有用：

<select id="pet-select">
  <option value="">--Please choose an option--</option>
  <option value="dog">Dog</option>
  <option value="cat"><h3 style="color:red">Cat</h3></option>
</select>

我在任何地方都找不到任何解决方案，甚至可以做到吗？

编辑：

我没有提到我使用的是 Select2 而不是普通的 Select。它在 Select 中有效，但在 Select2 中无效

Answer 1

像这样试试。

select option:nth-child(2) {
  color: blue;
}
select option:nth-child(3) {
  color: red;
}

<select id="pet-select">
  <option value="">--Please choose an option--</option>
  <option value="dog">Dog</option>
  <option value="cat">Cat</option>
</select>

如果您使用 select2，请查看here。