Question

Is it possible to have a style for the html select box when it’s just sitting there, and then a different color when the user has clicked on it and the items are listed?

I want something like this:

select {
    background:#fff;
    color:#929496;
    font-size:14px;
}

Then the colors are inverted, so the text is white and the background is grey?

Answer 1

Use the :focus pseudo-class:

select:focus {
    color: #fff;
    background-color: #929496;
}

This also applies the inverted colors to its options when they appear.

jsFiddle preview