IEで動作しないが、Chromeで動作するCSS

Question

テーブルの行の色を奇数行と偶数行で交互に表示しようとしています。シンプルで、クロームでうまく動作しますが、IEでテストしても何も変わりません。一番奇妙なことは、もともとはIEで動作しましたが、突然停止してしまい、再び動作させることができません。ここに私が使用しているCSSがあります。なぜこれがうまくいかないのでしょうか？ここ

.styleIntr { 
white-space: nowrap; 
margin-top: 5px; 
background-color: #DFF0F9; 
margin-bottom: 5px; 
border: 1px solid #CCC; 
height: 320px; 
z-index: 1; 
font-size: 9pt; 
color: #000; 
padding-left: 50px; 
padding-right: 50px; 
} 
    .styleIntr tr:nth-child(odd) td{ 
    background: #DFF0F9; 
    } 
    .styleIntr tr:nth-child(even) td{ 
    background: #EFF7FB; 
    } 

はHTMLです：

<table class="styleIntr" border="0" cellpadding="3" cellspacing="1" rules="rows" frame="hsides" align="right" 
width="10%">    

<TBODY><TR> 
<TD style="HEIGHT: 20px"><SPAN id=Label3>Time</SPAN> </TD> 
<TD style="HEIGHT: 20px"><SPAN id=Label4>Type</SPAN> </TD> 
<TD style="HEIGHT: 20px"><SPAN id=Label5>Type 1</SPAN> </TD></TR> 
<TR> 
<TD align=center style="HEIGHT: 20px">09:00 </TD> 
<TD align=center style="HEIGHT: 20px">S </TD> 
<TD align=center style="HEIGHT: 20px">B </TD></TR> 
<TR> 
<TD colSpan=3>&nbsp; </TD></TR> 
</TBODY> 
    </table> 

Answer 1

あなたは奇数と偶数行で代替テーブルの行の色にしようとすることができますが、あなたのスタイルは、あなたが行TDにこのCSSを追加する必要があり間違っています。そうIE8は、このコード

<script> 
$(document).ready(function() { 
    $(".styleIntr tr:nth-child(even)").addClass("even"); 
    $(".styleIntr tr:nth-child(odd)").addClass("odd"); 
}); 
</script> 
<style> 
    .styleIntr tr.odd{ 
    background: #DFF0F9; 
    } 
    .styleIntr tr.even{ 
    background: #EFF7FB; 
    } 
</style> 

n番目の子 使用をサポートしていない場合は、このフィドルを確認することができ、この 最初の使用のように、この

<style> 
    .styleIntr tr:nth-child(odd){ 
    background: #DFF0F9; 
    } 
    .styleIntr tr:nth-child(even){ 
    background: #EFF7FB; 
    } 
</style> 

OR

をTDを削除します。 https://jsfiddle.net/foku4qa3/

IEがサポートしていない場合は、こちらを使用してください。

<table class="styleIntr" border="0" cellpadding="3" cellspacing="1" rules="rows" frame="hsides" align="right" 
width="10%">    

<TBODY><TR> 
<TD style="HEIGHT: 20px"><SPAN id=Label3>Time</SPAN> </TD> 
<TD style="HEIGHT: 20px"><SPAN id=Label4>Type</SPAN> </TD> 
<TD style="HEIGHT: 20px"><SPAN id=Label5>Type 1</SPAN> </TD></TR> 
<TR> 
<TD align=center style="HEIGHT: 20px">09:00 </TD> 
<TD align=center style="HEIGHT: 20px">S </TD> 
<TD align=center style="HEIGHT: 20px">B </TD></TR> 
<TR> 
<TD colSpan=3>&nbsp; </TD></TR> 
</TBODY> 
    </table> 
<script> 
$(document).ready(function() { 
    $(".styleIntr tr:odd").addClass("odd"); 
    $(".styleIntr tr:even").addClass("even"); 
}); 
</script> 
<style> 
    .styleIntr tr:nth-child(odd){ 
    background: #DFF0F9; 
    } 
    .styleIntr tr:nth-child(even){ 
    background: #EFF7FB; 
    } 
    .styleIntr tr.odd{ 
    background: #DFF0F9; 
    } 
    .styleIntr tr.even{ 
    background: #EFF7FB; 
    } 
</style>