如何为“选择框”制作占位符？

Question

如何为“选择框”制作占位符？

我使用占位符作为文本输入，这很好。但是我也想用占位符作为我的选择框。当然，我可以使用以下代码：

<select>
    <option value="">Select your option</option>
    <option value="hurr">Durr</option></select>

但是“选择你的选项”是黑色的，而不是亮灰色的。所以我的解决方案可能是基于CSS的。jQuery也很好。

这只会使下拉列表中的选项变得灰色(因此在单击箭头之后)：

option:first {
    color: #999;}

编辑：问题是：人们如何在选择框中创建占位符？但它已经被回答了，干杯。

使用这个结果，所选值总是灰色的(即使在选择了一个真正的选项之后)：

select {
    color:#999;}

Answer 1

非CSS-没有javascript/jQuery答案如何？<select>&nbsp; &nbsp; <option value="" disabled selected>Select your option</option>&nbsp; &nbsp; <option value="hurr">Durr</option></select>

Answer 2

对于所需的字段，现代浏览器中有一种纯CSS解决方案：select:required:invalid {&nbsp; color: gray;}option[value=""][disabled] {&nbsp; display: none;}option {&nbsp; color: black;}<select required>&nbsp; <option value="" disabled selected>Select something...</option>&nbsp; <option value="1">One</option>&nbsp; <option value="2">Two</option></select>