html – CSS子选择器(>)不适用于IE

以下CSS在Firefox下运行良好,但在IE浏览器下无效,为什么？
另外,我如何只使用直接在父元素下的元素才能受到CSS的影响？

CSS：

.box{font:24px;}
.box>div{font:18px}
.box>div>div{font:12px;}

HTML：

<div class="box">
   level1
   <div>
      level2
      <div> level3</div>
      <div> level3</div>
   </div>
   <div>
      level2
      <div> level3</div>
      <div> level3</div>
   </div>
</div>

解决方法

Internet Explorer从版本7开始支持子选择器(>),但仅在标准模式下支持.确保您使用的是 a Doctype that triggers standards mode.

如果你的目标是IE6,那么你就不走运了.您需要依赖JS或使用后代选择器.

a>b { foo }

变

a b { foo }
a * b { reverse-of-foo }