通过CSS和IE 7 </select>设置<select>选项样式

Question

我想根据特定用户输入（添加新项目，编辑现有项目，然后使其处于活动/非活动状态）来设置列表框中的实际项目的样式。我想做的一件事是使用粗体（用于活动）和斜体（用于编辑的项目），只需将css类添加到相关列表项中（或在适当时将其取出）。

在Firefox中，这项工作。

在IE7中，它都不起作用。

为什么呢？这是一个怪癖模式的事情，还是IE7的黑暗之神，在他们难以形容和无限的疯狂中，这个判决一定不是吗？ Firefox是否违反了日内瓦公约？

这是我用于加粗目的的css类：

.active
{
    color:Black;
    font-weight: 600;
}

我也尝试了“更大胆”的字体重量，就像尝试彻底一样。这不起作用，我相信这对于不止一个人来说并不意外。

Answer 1

IE和firefox以不同的方式实现标签。

在IE中，你要求的是不可能的。

Answer 2

目前你不能这样做。多个浏览器不支持此功能。作为替代方案，您可以使用javascript将标准复选框替换为带样式的复选框。

一些jQuery选择复选框以显示可能性：

• http://www.brainfault.com/2008/02/10/new-release-of-jquery-selectbox-replacement/
• http://www.brainfault.com/2007/07/23/select-box-replacement/（原帖）
• http://theuiguy.blogspot.com/2008/09/select-box-factory-20-for-jquery.html
• http://www.scottdarby.com/2009/05/jquery-plugin-stylish-select-unobstrusive-select-box-replacement/

Answer 3

很多时候人们想要设置选项元素的样式，他们真的想要选择组。这会满足您的需求吗？ http://www.w3schools.com/tags/tag_optgroup.asp

如果您必须对选项进行完全CSS控制，那么大多数JavaScript库都有一个完全由javascript构建的选择框模拟器，您可以根据自己的内容设置样式。 http://www.ajaxupdates.com/jquery-select-box/

对我来说，历史表明用户并不关心甚至没有注意到额外的造型。但这让设计师感到高兴：）