css - 在 IE6 CSS 中使用双类？

Question

有没有办法让IE6理解双类，说我有一个 MenuButton 类，它有一个颜色类，可能还有一个点击类；喜欢:

.LeftContent a.MenuButton {..general rules..}  
.LeftContent a.MenuButton.Orange {..sets background-image..}  
.LeftContent a.MenuButton.Clicked {...hum ta dum...}

现在，IE6 可以理解<a class="MenuButton Orange"> ，但是当添加点赞<a class="MenuButton Orange Clicked"> , IE 只是忽略了单击规则。

当然，我可以重写我的 CSS，并为 .MenuButtonOrange 制定自己的规则
等等(这可能比问这个问题花费的时间要短得多；-)，
但是天哪，它就是这么没有吸引力而且 Web 0.9...

干杯!

Answer 1

IE6 不支持多个类选择器。您看到 Orange 类发生变化的原因是 a.MenuButton.Orange 被 IE6 解释为 a.Orange。

我建议以可以解决此问题的方式构建标记:

<div class="leftcontent">
   <ul class="navmenu">
     <li><a class="menubutton orange" href="#">One</a></li>
     <li><a class="menubutton orange clicked" href="#">Two</a></li>
   </ul>
</div>

通过按更具体的祖先分组，您可以创建具有该祖先作用域的类的变体(在本例中 navmenu):

.leftcontent .navmenu a { /* ... basic styles ... */ }
.leftcontent .navmenu a.orange { /* ... extra orange ... */ }
.leftcontent .navmenu a.clicked { /* ... bold text ... */ }

它不如多类好，但我用它来解决 IE 中缺乏支持的问题。