这里是一个更现代的解决方案，所以它不是特定于第一个选项，而是一个 invalid 选项，并且不需要JS来显示只有标题/占位符选项为灰色，而其余的显示正常。

select,
select option {
  color: #000000;
}

select:invalid,
select option[value=""] {
  color: #999999;
}

label {
  display: block;
  margin: 16px 0;
}

/*Added for browser compatibility*/
[hidden] {
  display: none;
}

个字符
select上的:invalid选择器仅在选择框是必需的 * 并且 * 所选选项的值为空时才对选项起作用，因此您可以将其样式设置为文本框的占位符文本。
将其设置为disabled可以防止用户在选择选项中选择它，而将其设置为hidden则可以在选择选项中隐藏它。
这是我的CodePen demo，它探索了其他的选择框样式，并在浅色背景上显示了这一个。

2017年9月编辑

你应该看看Tessa's answer below，因为它只是CSS，现在好多了！这个答案已经快5年了，所以事情已经改变了一点。我保留原来的答案只是为了参考。

原始答案

我更接近你所需要的：
你需要灰显整个SELECT（这样当它关闭时，它是灰色的），然后“un-gray”所有的OPTION（把它们变成黑色）和灰显第一个子元素。类似这样：

CSS

select
{
    color: #ccc;
}
option
{
    color: #000;
}
option:first-child
{
    color: #ccc;
}

字符串

• 编辑 * 所以编辑后的代码是：*
  超文本标记语言

<select onchange="changeMe(this)">
  <option selected disabled>Please select your favourite fruit</option>
  <option>Apple</option>
  <option>Banana</option>
</select>

型

JavaScript

<script type="text/javascript">
    function changeMe(sel)
    {
      sel.style.color = "#000";              
    }
</script>

型
我更新了jsFiddle，你可以在这里查看：http://jsfiddle.net/s5Xy2/5/
请注意，我还更改了HTML部分，因为我认为您希望使用“disabled”属性（因此，还必须添加“selected”属性）。
如果你仍然想要纯CSS代码，它在这里：http://jsfiddle.net/s5Xy2/4/

灵感来自Fábio Silva的解决方案，一个非常酷的解决方案，使用AngularJS：

select {
  color: #ccc;
}
option {
  color: #aaa;
}
option:first-child {
  color: #ccc;
}
select.ng-dirty {
  color: #aaa;
}

字符串

这是我2018年的版本，它结合了一些其他的答案和一些我自己的js。如果你想让第一个元素在关闭时变灰，似乎没有一个解决方案可以在不使用JavaScript的情况下工作。

var grayout = document.getElementsByClassName('grayout');

var grayOutSelect = function() {
    if ( this.value === "" ) {
        this.classList.add('gray');
    } else {
        this.classList.remove('gray');
    }
};

for (var i = 0; i < grayout.length; i++) {
    grayout[i].addEventListener('change', grayOutSelect);
    if ( grayout[i].value === "" ) {
        grayout[i].classList.add('gray');
    } else {
        grayout[i].classList.remove('gray');
    }
}

select {
  color: #333;
}
select.gray {
  color: #aaa;
}

/* Optional styles for when the select is open. Doesn't work on all browsers */
option {
  color: black;
}
.grayout option:first-child {
  color: gray;
}


/* Extra / just to make the demo look nice */
body {
  background: #ddd;
  padding: 30px;
  font-size: 20px;
}
select {
  margin: 0;
  vertical-align: top;
  padding: 5px 60px 5px 8px;
  background-color: #fff;
  background-image: url('https://upload.wikimedia.org/wikipedia/commons/4/4b/Feather-arrows-chevron-down.svg');
  background-position: 97% center;
  background-position: right 8px center;
  background-repeat: no-repeat;
  background-size: 18px;
  border: 2px solid #999;
  border-radius: 3px;
  -webkit-appearance: button;
  -webkit-border-radius: 3px;
  -webkit-padding-end: 30px;
  -webkit-padding-start: 8px;
  -webkit-user-select: none;
  -moz-appearance: none;
  font-size: inherit;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  transition: border 300ms;
}

<p>main example</p>
<p>
  <select class="grayout">
    <option value="">Please select your favourite fruit</option>
    <option value="apple">Apple</option>
    <option value="banana">Banana</option>
  </select>
</p>
<p>one of the real options is selected</p>
<p>
  <select class="grayout">
    <option value="">Please select your favourite computer</option>
    <option value="apple" selected>Apple</option>
    <option value="c64">Commodore 64</option>
    <option value="gateway2000">Gateway 2000</option>
  </select>
</p>
<p>the grayout style is not applied here</p>
<p>
  <select>
    <option value="">Please select your favourite insult</option>
    <option value="jerk">Jerk</option>
    <option value="ahole">A**hole</option>
    <option value="shakespeare">Thou damned and luxurious mountain goat</option>
  </select>
</p>

您可以将您的代码编辑为我的代码：

<select id="drop">
  <option>Please select your favourite fruit</option>
  <option>Apple</option>
  <option>Banana</option>
</select>
<style type="text/css">
#drop :first-child
{
color:gray;
}
</style>

字符串
此代码将第一个项的颜色设置为灰色。