如何使Internet Explorer 8的支持n个子（）CSS元素？如何使Internet Ex

我想给斑马条纹效果，我的表​​行。 在所有其他的浏览器可以使用CSS n个子元素来完成。 但我想这样做，IE 8也。 所以，我该怎么办呢？

Answer 1:

您可以使用http://selectivizr.com/ JS支持IE浏览器CSS3选择器。

Answer 2:

随着填充工具： Selectivizr是不够好。

如果没有填充工具：由于IE8支持第一的孩子，你可以欺骗这个支持第n个孩子在IE8即

/*li:nth-child(2)*/
li:first-child + li {}/*Works for IE8*/

虽然我们无法模拟复杂的选择，即对IE8的第n个孩子（2N + 1）或者第n个孩子（单数）。

Answer 3:

作为一种替代Selectivizr，你可以使用一个小的jQuery：

$('.your-list li:nth-child(3n+1)').addClass('nth-child-3np1');

然后，只需在你的CSS增加一个选择：

:nth-child(3n+1)
{
    clear: both;
}

.nth-child-3np1
{
    clear: both;
}

Answer 4:

“第一胎”和“+”选择在IE7都可用，而“+”是添加剂。

因此，“第n个孩子”可以依次加入“+”选择，因此模拟：

tr:nth-child(4)

变为：

tr:first-child + tr + tr + tr

如果所有兄弟元素是相同的，那么“*”通配符就足够了，如：

tr:first-child + * + * + *

其中，如果指定大量的行会减少CSS文件的大小。

需要注意的是选择之间的空间不是必需的，所以文件大小可以通过让他们出进一步降低，所以选择第1，第3和第5行：

tr:first-child,tr:first-child+*+*,tr:first-child+*+*+*+*

当然是不希望以应付非常大的表！

如果使用*作为填充物，确保:first-child元素和最后一个元素会得到明确的标记名，因为该规则将针对在DOM每个元素进行测试，并指定这两个元素在哪个年底明确强制失败一个特定的浏览器应用其规则第一，而不是它不得不跨过几个要素每一个序列中最终失败为他们每个人的统治后失败。 不要让你的浏览器的工作没有很好的理由！

文章来源: How to make Internet Explorer 8 to support nth child() CSS element?