如何使每隔一个div变成不同的颜色

时间:2015-09-23 20:01:47

标签: html css twitter-bootstrap css3

我坚持使用一些代码,我希望将bg颜色替换为#F8F8F8 .itemrow上的颜色

这里是粘贴箱: http://pastebin.com/mgHYzJAd

int value_F = simplex(row,col, A,B, value);

和项目页面,如果你想看到它: http://paolor.co.uk/projects/grubrun/menu.php

我试图做一些研究,nth-child(奇数)已经出现过几次,但这并不是我在3个月之前遇到过的事情我是&#39已经做了前端。

任何帮助表示赞赏,并提前感谢您! :O) 保罗

3 个答案:

答案 0 :(得分:7)

怎么样:

.itemrow:nth-child(even) {
    background-color:#f8f8f8;
}

而不是even您也可以使用odd。我以前没有找到它,这让我很惊讶。它已经存在了很长一段时间,并且至少从IE9开始就受到支持,我认为即使是从IE7开始。然后,你经常不需要它。我认为交替背景是我迄今为止所见过的唯一目的。

答案 1 :(得分:4)

nth-child(odd)适合我。你试过了吗?

.itemrow:nth-child(odd) {
  /* your styles here */
}

答案 2 :(得分:2)

为了获得更大的灵活性,请使用乘数:

.itemrow:nth-child(2n) {
    background-color:#f8f8f8;
}

可以让你这样做:

.itemrow:nth-child(2n + 1) {
    background-color:#f8f8f8;
}

小提琴:http://jsfiddle.net/k37m1yak/ 浏览器支持:http://caniuse.com/#search=nth-child