hello hello - 3 months ago 7
CSS Question

How to change font size of the first option tag in a dropdown menu (select)?

How can I change the font size for the first option tag in a select tag? I've tried changing the CSS for the option:first-child with no luck.

I would like the first option to have 25px font-size while the other items on the list to have 12px font-size.

I've already read tutorials here that can change the font color and font type for the first option, but when I applied font-size on them, it doesn't seem to take effect.

Can this be achieved through CSS or JQuery? Thanks!

HTML Code:

<select>
<option>Select (25px)</option>
<option>List 1 (12px)</option>
<option>List 2 (12px)</option>
<option>List 3 (12px)</option>
<option>List 4 (12px)</option>
</select>

Answer

If this below is the option you want to change the font size in SELECT tag

    <option id="op1">option 1</option>

Place the below code in head element

   <script>
     document.getElementById("op1").style.fontSize ="25px";
   </script>
Comments