CODEWITHSUNDEEP
htmlcsshtml-select
Harsha M V
Harsha M V

Reputation: 54949

Select and Options Styling

How to style the select options? I want alternating background colors in the drop down menu.

Upvotes: 2

Views: 2402

Answers (3)

Pappu
Pappu

Reputation: 1

Just add size attribute along with select tag. Example select size="4", where 4 is the no of options to be displayed.

Upvotes: 0

Igor Zinov'yev
Igor Zinov'yev

Reputation: 3706

OK, if this is going the way of HTML/CSS, I might as well suggest a wonderful jQuery UI plugin called UI Selectmenu. It is the most wonderful thing I have seen about select menus so far. I bet you could easily implement alternating option colors with it.

But it's fair to say that this plugin is in development stage - proceed with caution!

Upvotes: 0

RoToRa
RoToRa

Reputation: 38390

Just like any other element

option:nth-child(even) {
  background-color: red;
}

option:nth-child(odd) {
  background-color: blue;
}

If you need to support browsers that don't support nth-child you'll need to use a class.

Some browsers don't support styling options at all (guess which ones).

Upvotes: 8

Related Questions