How to style the option of an html “select” element?

Here’s my HTML:

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

I want to make the name of the product (i.e. ‘Product1’, ‘Product2’ , etc) bold, and its categories(viz. Electronics, Sports, etc) italicized, using CSS only. I found an old question that mentioned it’s not possible using HTML and CSS, but hopefully, there’s a solution now.

20 Answers
20

Leave a Comment