Vằn sọc vằn hai sọc TR liên tiếp với CSS.

Question

Tôi muốn màu xám/sọc mỗi hai hàng trong một hàng. Khó giải thích của nó. Đây là một hình ảnh ::
| -^-^-^-^-^- |
| -^-^-^-^-^- |
| ------------- |
| ------------- |
| -^-^-^-^-^- |
| -^-^-^-^-^- |
| ------------- |
| ------------- |
| -^-^-^-^-^- |
| -^-^-^-^-^- |
| ------------- |
| ------------- |

Answer 1

Như thế này? http://jsfiddle.net/GQNUV/1/

table tr:nth-child(4n-1), table tr:nth-child(4n) { 
    background: #ccc; 
} 

Answer 2

Thay đổi này sở thích của bạn, nó sẽ làm việc

tr:nth-child(4n+1) { color: green; } 
tr:nth-child(4n+2) { color: green; } 
tr:nth-child(4n+3) { color: red; } 
tr:nth-child(4n+4) { color: red; } 

Answer 3

Đối với điều này để làm việc đúng cách, các n trong nth-child() phải giống nhau, nhưng bạn thay đổi những gì bạn thêm vào n. Trong trường hợp này, các con số chỉ có thể cách nhau một số. Vì vậy, bạn cần 4n+1 và 4n, hoặc 4n+2 và 4n+3 vv

Fiddle

Answer 4

Nếu bạn có một hàng cho các tiêu đề, thêm thead và tbody và thay đổi css để:

table tbody tr:nth-child(4n-1), table tbody tr:nth-child(4n) { 
    background: #ccc; 
}