Question

我有Css代码用于区分不同颜色的奇数行和偶数行

.historyLog tr:nth-child(odd) td {
background-color:blue;
}
.historyLog tr.odd td{
    background-color: blue;
}

.historyLog tr:nth-child(even) td {
background-color:orange;
}
.historyLog tr.even td{
    background-color: orange;
}

拥有班级.historyLog

<table class="historyLog">
<tr><td></td></tr>
<tr><td></td></tr>
</table>

问题在于，当我使用class属性.historyLog i.ie

应用Css时

.historyLog tr:nth-child(odd) td {
background-color:blue;
}

IE8不会执行它，我会得到的是所有行的相同颜色，无论是偶数还是奇数。但是如果我在不使用表的类属性的情况下应用css，即

tr:nth-child(odd) td {
background-color:blue;
}

然后IE8用不同颜色的奇数偶数行执行它。请帮我解释IE8如何使用表的class属性以不同颜色显示奇数和偶数行。

Answer 1

由于IE8不支持CSS3选择器。你可以很好地使用内置的jQuery：odd或：even选择器来实现相同的功能。

$(".historyLog tr:odd").css('background-color','blue');
$(".historyLog tr:even").css('background-color','white');

或者您可以使用css类文件

$(".historyLog tr:odd").addClass("odd");
$(".historyLog tr:even").addClass("even");

Answer 2

你不能，因为IE8不支持CSS3。

You could do this with jQuery：

$('tr').each(function(){
    if ($(this).index()%2<1)
        $(this).addClass('even');
});

CSS3在IE8上甚至按不同的颜色排列

2 个答案: