我在下拉列表中有一个如此组织的数据树（但有更多选项）：
pizza
pizza.mediterranean
pizza.veggie
pizza.meatlover
drinks
drinks.soda
drinks.soda.pepsi
drinks.soda.coke
drinks.beer
drinks.water
我希望较大的类别（披萨，饮料）显示为optgroups，但我希望能够在下拉列表中选择一个optgroup作为选项。我读过多个地方的是，optgroups仅用于分组，无法选择。
由于我还想要多个缩进级别以允许下拉列表尽可能接近上面的示例 - 也许optgroups不是要走的路，而是css解决方案。在Firefox中，我可以通过向选项添加样式并使它们变为粗体和/或左边填充来做我想要的但是在webkit中似乎唯一的原因我可以在下拉列表中更改选项是他们的颜色。
有没有人知道如何使用optgroups，css或其他任何东西在webkit（chrome / safari）和firefox中实现这种效果---（我现在真的不关心IE）？
答案 0 :(得分：1)
你可能只想低技术：
<select>
<option>Root</option>
<option> Second level</option>
<option> Third level</option>
</select>
您正在达到使用真实选择所能做的极限。从概念上讲，这些选择小部件是由操作系统绘制的（虽然有些浏览器 - Firefox也有自己的实现），因此样式选项有限。
有许多不错的精选替代品。我最熟悉的是jqueryui的autocomplete。它既快速又灵活，您可以根据自己的喜好设计选项。可以想象使用jquery或其他工具包的其他本土解决方案 - 或简单的'ol javascript。
答案 1 :(得分：1)
使用一组单选按钮（或复选框，如果允许多个选项）而不是select元素，您可以像任何其他内容一样组织和设置样式，例如压痕和粗体。但它不会作为下拉菜单，但实际上这可以是可用性和可访问性改进。