CSS pseudo-class fallback?

问题

I'd like to use the tr:nth-child(even/odd) pseudo class for a table, but I want to support the IE 2 population as well. So, is there any purely css way to add a border to tr if nth-child isn't supported?

回答1:

You can try Selectivizr, I think that's the easiest solution.

EDIT:

You could also use jquery to add classes for you:

$(function() {
    $("tr:odd").addClass("odd");
    $("tr:even").addClass("even");
});

EDIT2:

Also, if you're using Modernizr, you could try this.

EDIT3 :)

tr { border-bottom: 1px solid #ccc; }

tr:nth-child(odd),
tr:nth-child(even) { border: none; }

tr:nth-child(odd) { background: #eee; }

tr:nth-child(even) { background: #ddd; }

回答2:

You could add + between your classes/elements to do like in this example below, every 5 <tr> remove the margin-right

tr{margin-right:10px;}
tr + tr + tr + tr + tr{margin-right:0;}

A great replacement for NTH pseudo-classes without any javascript and IE7+ compatible ;)

来源：https://stackoverflow.com/questions/15323591/css-pseudo-class-fallback