[html] CSS :selected pseudo class similar to :checked, but for <select> elements

Is there a way to style the currently selected <option> element in a <select> element?

I could then give a background color to the currently selected option element? That way I can style the option that's currently viewable in the closed dropdown.

Actually you can only style few CSS properties on :modified option elements. color does not work, background-color either, but you can set a background-image.

You can couple this with gradients to do the trick.

option:hover,_x000D_
option:focus,_x000D_
option:active,_x000D_
option:checked {_x000D_
  background: linear-gradient(#5A2569, #5A2569);_x000D_
}

<select>_x000D_
  <option>A</option>_x000D_
  <option>B</option>_x000D_
  <option>C</option>_x000D_
</select>

Works on gecko/webkit.

This worked for me :

select option {
   color: black;
}
select:not(:checked) {
   color: gray;
}