如何设置html“选择”元素的选项的样式？

这是我的HTML：

<select id="ddlProducts" name="ddProducts"> 
    <option>Product1 : Electronics </option>
    <option>Product2 : Sports </option>
</select>

我想仅使用CSS将产品名称（即“ Product1”，“

Product2”等）加粗，并将其类别（即电子，体育等）斜体化。我发现一个老问题，提到无法使用HTML和CSS，但希望现在有解决方案。

只有少数样式属性可以应用于<option>元素。

这是因为这种类型的元素是“已替换元素”的示例。它们与操作系统有关，不属于HTML /浏览器。无法通过设置样式CSS。

有更换插件/库看起来像<select>，但实际上是由正规的HTML那个元素样式。