IE8:让'nth-child`选择器在媒体查询中工作？

Question

在我的网站项目中,我使用媒体查询和第n个子选择器.

IE8不支持开箱即用,但有多种填充物可以帮助:

• Respond.js,mediatizr或css3-mediaqueries.js在IE8中启用媒体查询;
• selectivizr或ie9.js启用第n个子选择器.

我的问题是我需要在媒体查询中使用nth-child.一个合成的例子:

@media (min-width: 500px) {
  .foo:nth-child(2n) {
    color: pink;
  }
}

我需要这个代码在IE8中工作.

问题在于,selectivizr和ie9.js都没有nth-child在媒体查询中解析,并且支持媒体查询的polyfill也无济于事,因为它们nth-child在一起使用时会干扰polyfill.

请建议一种方法,使该代码在IE8中工作!

Answer 1

好的,我明白了.

Selectivizr和响应都被修改,以一起工作(1,2).

问题是已经对Selectivizr版本1.0.3b做出了必要的修改.截至2013年3月,尚未发布1.0.3b.它既不适用于Selectivizr的官方网站,也不适用于CDN.它只能得到从项目的回购,只有未压缩的版本可用于现在.

对于发布版本,响应更快,因此最新的官方版本将会发布.

请注意,应首先包括Selectivizr,第二个响应.并且不要忘记在Selectivizr之前加入Selectivizr的一项要求!所以正确的顺序是:

1. NWMatcher(或替代)
2. Selectivizr
3. 响应

并且不要使用IE9.js!它有自己的媒体查询实现,与Respond一起将使您的网站在IE <9中无法使用.