24

有什么方法可以让 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">，但是当添加 Clicked,like 时<a class="MenuButton Orange Clicked">，IE 只是忽略了 Clicked 规则。

当然，我可以重写我的 CSS，并且对 .MenuButtonOrange
等有自己的规则（而且它可能比问这个问题花费的时间要短得多 ;-)，
但是天哪，它太不吸引人了，而且 Web 0.9 ......

干杯!

4

3 回答 3

39

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 中缺乏支持的问题。

于 2008-11-23T02:36:12.877 回答
17

Dean Edwards 的 IE7 脚本为 IE6 添加了多个类支持。请参阅http://code.google.com/p/ie7-js/

于 2010-01-07T16:47:33.210 回答
7

如果我使用（就像我在问题中写的那样），特定于标签的规则，例如 .LeftContent a.MenuButton.Orange，它可以工作......

It only matches them if the classes in the selector are in the same order as the classes on the element.

这并不完全正确。IE6（和 Quirks 模式下的 IE7）每个选择器部分只记住一个类。如果你写两个，第二个会覆盖第一个。所以“a.MenuButton.Orange”在效果上与“a.Orange”相同。

所以现在仍然必须避免使用多个类选择器。

于 2008-11-23T13:05:25.833 回答