IE:nth-​​child()使用odd/even不起作用

aja*_*221 23 css internet-explorer css-selectors css3 css-tables

我的表(在Chrome,FireFox和Opera上完美运行)无法在Internet Explorer上正确显示.

背景仍为白色!(我使用的是IE-8)

CSS代码:

/*My Table*/
.my_table{
border-collapse:collapse;
font:normal 14px sans-serif,tahoma,arial,verdana;
margin:5px 0;
}

.my_table th{
color:#fff;
background:#5E738A;
border:1px solid #3C5169;
text-align:center;
padding:4px 10px;
}

.my_table td{
color:#555;
border:1px solid #C1CAD4;
text-align:center;
padding:2px 5px;
}

.my_table tr:nth-child(even){
background:#E6EDF5;
}

.my_table tr:nth-child(odd){
background:#F0F5FA;
}
Run Code Online (Sandbox Code Playgroud)

Abd*_*nim 53

作为一个很好的解决方法,jQuery已将其添加到他们的项目中,并且使用JavaScript实现这一点是可以接受的:

对于我的CSS,我会的

.my_table tr.even{
    background:#E6EDF5;
}

.my_table tr.odd{
    background:#F0F5FA;
}
Run Code Online (Sandbox Code Playgroud)

我会用jQuery来做到这一点:

$(document).ready(function() {
    $(".my_table tr:nth-child(even)").addClass("even");
    $(".my_table tr:nth-child(odd)").addClass("odd");
});
Run Code Online (Sandbox Code Playgroud)


Cli*_*ive 16

IE8不支持nth-child选择器我害怕:

http://reference.sitepoint.com/css/pseudoclass-nthchild


Mic*_*ant 5

它是一个IE8(以及之前的IE版本)问题,这个链接显示了一个很好的修复:

http://verboselogging.com/2010/01/17/making-nth-child-work-everywhere