2

奇数行と偶数行を異なる色で区別するための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>

私の問題は、クラス属性 .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が奇数行と偶数行を異なる色で表示する方法を教えてください。

4

2 に答える 2

12

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");
于 2012-08-24T09:24:53.703 に答える
6

IE8 は CSS3 をサポートしていないため、できません。

jQuery でこれを行うことができます：

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

</p>

于 2012-08-24T08:00:41.783 に答える