选择和选项样式

Question

如何设置选项的样式？我想在下拉菜单中交替使用背景颜色。

Answer 1

就像任何其他元素一样

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

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

如果您需要支持不支持nth-child的浏览器，则需要使用课程。

有些浏览器根本不支持样式option（猜猜哪些）。

Answer 2

好的，如果这是HTML / CSS的方式，我不妨推荐一个名为UI Selectmenu的精彩jQuery UI插件。到目前为止，这是关于选择菜单的最美妙的事情。我打赌你可以用它轻松实现交替的选项颜色。

但公平地说，这个插件处于开发阶段 - 请谨慎行事！

Answer 3

只需添加尺寸属性和选择标记即可。示例select size =“4”，其中4是要显示的选项的数量。