HTML选择选项需要突出显示

Question

我正在创建一个HTML下拉列表。这是我的代码

http://jsfiddle.net/dineshk/u47xjqLv/

HTML

<select>
    <option class="first"  style="display:none;">HH</option>  
    <option class="green">Hello</option> 
    <option>Magazine</option>         

</select>

我首先Option给Display:none所以它不应该显示在下拉列表中。多数民众赞成工作很酷!!!!，但我不能为此首先给出颜色Option因此它是下拉的标题，请帮我找到答案

Answer 1

选项1

您可以在select和option上设置颜色，为下拉列表和占位符文字（HH）提供颜色。

Fiddle

示例

select {
  color: red;
}

select option {
  color: black;
}

选项2

如果第一个选项（Hello）纯粹是一个标题，并且您不希望它被选中，那么您应该将其设置为disabled。然后你可以相应地设置它。

Fiddle

示例

<select>
  <option class="first"  style="display:none;">HH</option>  
  <option disabled class="green">Hello</option> 
  <option>Magazine</option>         
</select>

select option[disabled] {
  color: red;
}

Answer 2

您也可以尝试 -

jsfiddle

CSS： - 的

option:nth-child(2){color:red}