Is there a way to change the default color of a selected html listbox item?

Question

Ok, not sure if this is even possible, but I want to change the default color of a selected HTML listbox item. I'm not talking about the background color of the listbox option tag. That can be done through CSS, I get that. I'm talking about the color that overrides that background color when the item is selected. In Chrome, FF, and IE if I just change the background color to red and then select the item from the list, the color is now blue. I can't seem to find anything on whether or not overriding the color is possible, but I was hoping someone here might know. Thanks for any help.

Answer 1

Not reliably. The <select> element's rendering is controlled by the operating system, so it's not something that's simple to style. Most services that attempt this use JS/HTML/CSS to create pseudo- elements that can be styled at will rather than true <select>s.

Generally speaking, I wouldn't recommend styling this element for UX reasons anyway. Users need to see UI elements acting and looking in similar ways to grok their purpose and behaviour. Overriding default behaviour can erode that.