HTML の「select」要素のオプションをスタイルするにはどうすればよいですか?

Question

これは私の HTML コードです:

<select id="ddlProducts" name="ddProducts">
    <option>製品 1: 電子製品</option>
    <option>商品 2: スポーツ用品</option>
</select>

CSS を使用して、製品名 (「製品 1」、「製品 2」など) を太字にし、カテゴリ (エレクトロニクス、スポーツ用品など) を斜体にしたいと考えています。 HTML と CSS を使用することは不可能であるという古い質問を見つけましたが、現在解決策があることを願っています。

Answer 1

いいえ、これらの要素のスタイルはユーザーのオペレーティング システムによって処理されるため、これは不可能です。 MSDN はここであなたの質問に答えます:

Answer 2

<option> 要素に適用できるスタイル属性はわずかです。

このタイプの要素は「置換要素」の一例であるためです。これらはオペレーティング システムに依存しており、HTML/ブラウザの一部ではありません。 CSS を介してスタイルを設定することはできません。

<select> のように見える代替プラグイン/ライブラリもありますが、実際にはスタイルを設定できる通常の HTML 要素で構成されています。