开发者

Make alternating CSS table row style work in Internet Explorer

I use this CSS code to display a database output in rows where the colors repeat in every 2nd row

tbody tr:nth-child(2n) td, tbody tr.even td {  
    background: none repeat scroll 0 0 #E5ECF9;  
}

If I open it in my IE it won't work开发者_如何学JAVA. Any advice?

I am using IE 8.


IE8 does not support the :nth-child CSS property. You can make it work in IE8 with this script:

https://github.com/roylory/ie7-js

How to use it:

You can Include it via conditional comments, e.g.:

<!--[if lte IE 9]>
<script src="IE9.js"></script>
<![endif]-->

The script will only load in IE9 and below, other browsers do not see it.

Live demo: https://jsbin.com/koyahe/edit?html,css,output

(This demo should work in all versions of IE.)


I like the answer above, but alternate row colours doesn't seem to work if a document isn't refreshed.

Try jQuery too:

$("tbody tr:even td").css("background-color", "lightgray");

Link:
http://docs.jquery.com/Tutorials:Zebra_Striping_Made_Easy


Which version of IE are you using? the :nth-child() CSS won't work in old versions of IE.

IE6, IE7, IE8 Fail

IE9 (works)

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜