html - select option 文字色 - セレクト」ボックスのプレースホルダーを作るにはどうしたらいいですか?

セレクトボックス CSS おしゃれ / html / css / html-select / placeholder

テキスト入力にプレースホルダーを使用しており、うまくいっています。しかし、セレクトボックスにもプレースホルダーを使いたいと思っています。もちろん、このコードを使うこともできます。

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

これにより、ドロップダウンでオプションが灰色になるだけです(矢印をクリックした後の状態)。

option:first {
    color: #999;
}

また、これを使用すると、(本物のオプションを選択した後でも)選択された値が常にグレーになります。

select {
    color: #999;
}

Peter Mortensen



Answer #1
<select>
  <option hidden>Sex</option>
  <option>Male</option>
  <option>Female</option>
</select>