Como fazer uma lista zebrada?

CSS

07/11/2016

Opa pessoal, me tirem uma dúvida rapidinho.

To com uma tabela que traz vários registros, e queria deixar os resultados virem num estilo zebrado.

Queria saber como fazer isso e também queria saber se eu posso escolher as cores de zebrado no css.
Tiago Dias

Tiago Dias

Curtidas 0

Melhor post

Nathália Hirth

Nathália Hirth

07/11/2016

Se for uma tabela pode fazer assim: 

tr:nth-child(even) {
    background: #CCC
}
tr:nth-child(odd) {
    background: #FFF
}


ou se for uma <li> é so trocar tr por li.

Even é par e odd é impar, ou seja, ele vai por a cor selecionadas nas linhas ímpares e a outra nas linhas pares.
GOSTEI 5

Mais Respostas

Jones Granatyr

Jones Granatyr

07/11/2016

Opa! Uma alternativa é fazer uma nova classe para cada uma das cores, e chamar a classe em cada tag TR: <tr style="cor1"> e <tr style="cor2">
GOSTEI 2
Marcelo Pastore

Marcelo Pastore

07/11/2016

Usando framework(JQuery)

http://tableless.com.br/melhorando-exibicao-tabelas-jquery/
GOSTEI 2
Larissa Aguiar

Larissa Aguiar

07/11/2016

Oi gente, Que legal!

Muito maneiro!
GOSTEI 0
Tiago Dias

Tiago Dias

07/11/2016

Obrigado a todos pela ajuda!

Mas me parece que a solução apresentada pela Nathália foi a mais simples!

Mesmo assim obrigado a todos pela ajuda. Achei que fosse um pouco mais complicado fazer isso.

Valeu
GOSTEI 1
Marcelo Pastore

Marcelo Pastore

07/11/2016

Sem duvida é a mais simples! Mas atualmente usam bastante framework, depois pesquise mais sobre JQuery.
GOSTEI 1
POSTAR