Internet Explorer 6似乎完全忽略了select,option或optgroup标签上的CSS类或规则.
有没有办法绕过这个限制(除了安装最新版本的IE)?
编辑:更确切地说,我正在尝试在这样的选项之间构建一个层次结构:
这是HTML片段:
<select name="hierarchicalList" multiple="multiple"> <option class="group niv0">Os developers</option> <option class="group niv1">Linux</option> <option class="user niv2">Linus Torvald</option> <option class="user niv2">Alan Cox</option> <option class="group niv1">Windows</option> <option class="user niv2">Paul Allen</option> <option class="user niv2">Bill Gates</option> <option class="group niv1">Mac Os</option> <option class="user niv2">Steve Wozniaz</option> </select>
这里是CSS规则,在最近的浏览器(如FF3)上工作正常但在IE6上根本不工作:
select option { line-height: 10px; } select option.group { font-weight: bold; background: url(path_to_group_icon.gif) no-repeat; padding-left: 18px; } select option.user { background: url(path_to_user_icon.gif) no-repeat; padding-left: 18px; } select option.niv0 { margin-left: 0px; } select option.niv1 { margin-left: 10px; } select option.niv2 { margin-left: 20px; }
解决方法
这不会完全符合你的要求,但你可以使用一些,而不是使用CSS
  ;
对于缩进,或破折号:
1级
– 级别2
– 等级3
等等
如果你不是特别喜欢它,你可以用它们包围它们
<!--[if lt IE 7]><![endif]-->
要么
<!--[if IE 6]><![endif]-->
看起来就像
Level 1 <!--[if lt IE 7]>-<![endif]-->Level 2 <!--[if lt IE 7]>--<![endif]--> Level 3
然后你可以拥有现代浏览器的CSS.