我需要使我的表格的每两行灰色,如果可能,我宁愿使用第三个孩子。
我已经搞乱了Chris Coyier’s nth-child tester,但仍然无法得到它。
我需要以下公式:
1,2 - grey 3,4 - white 5,6 - grey 7,8 - white 9,10 - grey
等等。我不想把一个类放在html中,因为我确信这将是一些建议。如果有办法把这个与第n个孩子拉下来,那就是我要找的东西。
解决方法
意识到你正在做4组,那么你可以看到你可以拥有每个第4个元素和每个第4个元素减去一个是白色,然后每4个元素减去2个,或者每个第4个元素减去3个是灰色的。
那么你会使用4n和4n-1,然后使用4n-2和4n-3:
div:nth-child(4n),div:nth-child(4n-1) { background: red; } div:nth-child(4n-2),div:nth-child(4n-3) { background: blue; }
那个代码对你的情况并不精确,我写了一个jsFiddle proof-of-concept。
NB免责声明:请记住,第n个孩子在IE8中不起作用。典型的问题当然是。