如果第一个项目将用作占位符（空值），并且您的选择是required，则可以使用:invalid伪类将其作为目标。
第一个

那这个呢：
第一个
http://jsbin.com/acucan/9

对于用作占位符的选项1：

select:invalid { color:grey; }

所有其他选项：

select:valid { color:black; }

这里有一种方法，当您选择一个选项时，它会变成黑色。当您将它改回占位符时，它会变回占位符颜色（在本例中为红色）。
http://jsfiddle.net/wFP44/166/
它要求选项具有值。
第一个

您 可以 使用 CSS 来 执行 此 操作 ：JSFiddle 的 最 大 值
于 飞 ：

<select>
    <option>Text 1</option>
    <option>Text 2</option>
    <option>Text 3</option>
</select>

中 的 每 一 个
CSS ：

select option:first-child { color:red; }

格式
或者 ， 如果 您 绝对 需要 使用 JavaScript （ 不 建议 这样 做 ） ：JSFiddle 格式
JavaScript 语言 ：

$(function() {
    $("select option:first-child").addClass("highlight");
});

格式
CSS ：

.highlight { color:red; }

格式

我 真 的 很 想 这样 （ 文本 框 的 占位 符 应该 和 选择 框 的 占位 符 看 起来 一样 ! ） ， 而 直接 的 CSS 在 Chrome 中 不 起 作用 。
首先 确保 您 的 select 标记 具有 .has-prompt 类 。
然后 在 document.ready 中 的 某 个 位置 初始 化 此类 。

# Adds a class to select boxes that have prompt currently selected.
# Allows for placeholder-like styling.
# Looks for has-prompt class on select tag.
Mess.Views.SelectPromptStyler = Backbone.View.extend
  el: 'body'

  initialize: ->
    @$('select.has-prompt').trigger('change')

  events:
    'change select.has-prompt': 'changed'

  changed: (e) ->
    select = @$(e.currentTarget)
    if select.find('option').first().is(':selected')
      select.addClass('prompt-selected')
    else
      select.removeClass('prompt-selected')

中 的 每 一 个
然后 在 CSS 中 ：

select.prompt-selected {
  color: $placeholder-color;
}

格式

以下代码适用于Chromium，一旦选择了某个选项，就会将颜色更改为黑色：

select {
  appearance: none;
}

select:invalid {
  color: green;
}

select option {
  color: black;
}

看起来用纯css的花哨方式会更贵;让我们看看ES6

CSS
select{color:#AE1250}

JS
document.querySelectorAll('select').forEach((s) => {
    s.addEventListener('change',(e)=>{
    s.style.color=s.value==''?'#AE1250':'#fff';});            
 });