選択オプションのプレースホルダーのフォント色を設定する

Question

ドロップダウンリストのプレースホルダーのフォント色を設定する方法を探しています。 select IDが必要なときは次のようになりました。しかし、これらのドロップダウンリストを入力する必要はありません。必要なタグを削除すると、プレースホルダフォントが黒に戻ります。

次は私のドロップダウンリストである：あなたの助け

Answer 1

ビットハックが、作品の

<select id="searchresults4" name="primarysport"> 
    <option value="">Choose Primary Sport...</option> 
    <option>Football</option> 
    <option>Basketball</option> 
    <option>Baseball</option> 
    <option>Softball</option> 
    <option>Soccer</option> 
    <option>Golf</option> 
</select> 

おかげ。それは、私が質問を正しく理解しているかどうかです。

select { 
 
    color: #9e9e9e; 
 
} 
 
option:not(:first-of-type) { 
 
    color: black; 
 
}

<select id="searchresults4" name="primarysport"> 
 
    <option value="">Choose Primary Sport...</option> 
 
    <option>Football</option> 
 
    <option>Basketball</option> 
 
    <option>Baseball</option> 
 
    <option>Softball</option> 
 
    <option>Soccer</option> 
 
    <option>Golf</option> 
 
</select>

Answer 2

select { 
 
    color: #9e9e9e; 
 
}

<select id="searchresults4" name="primarysport"> 
 
    <option value="">Choose Primary Sport...</option> 
 
    <option>Football</option> 
 
    <option>Basketball</option> 
 
    <option>Baseball</option> 
 
    <option>Softball</option> 
 
    <option>Soccer</option> 
 
    <option>Golf</option> 
 
</select>

Answer 3

この方法を見...

select:required:invalid { 
 
    color: gray; 
 
} 
 
option[value=""][disabled] { 
 
    display: none; 
 
} 
 
option { 
 
    color: black; 
 
}

<select id="searchresults4" name="primarysport" required> 
 
    <option value="" disabled selected>Choose Primary Sport...</option> 
 
    <option>Football</option> 
 
    <option>Basketball</option> 
 
    <option>Baseball</option> 
 
    <option>Softball</option> 
 
    <option>Soccer</option> 
 
    <option>Golf</option> 
 
</select>

Answer 4

変更するには、このに持っている現在のCSS：

select, select[size="0"], select[size="1"] { 
border-radius: 0px; 
border-color: rgb(169, 169, 169); 

}

これはと同じ結果を行います：必要なを使用しない

select:required:invalid { 
color: #9e9e9e; 

}

。