Tabela com as cores das linhas alternadas

Mardocréu · Agosto 14, 2012

Olá gente, eu sou iniciante em administração de sites e não sei muita coisa de HTML/CSS e preciso de uma ajuda, o código abaixo é de uma tabela que mostra games instalados no site, o problema é que todas as linhas tem as mesmas cores e preciso editar pra ficar com cores alternando entre "row1" e "row2", eu fiz várias tentativas mas nada que tentei funcionou, alguém poderia me ajudar com isso por favor, desde já agradeço qualquer ajuda.

<table cellspacing="1">
    <col class="row1" /><col class="row2" /><col class="row2" />
<thead>
<tr>
    <th>{L_NAME}</th>
    <th>{L_OPTIONS}</th>
    <th>{L_ACTIONS}</th>
</tr>
</thead>
<tbody>
<tr>
    <td class="row3" colspan="3"><strong>{L_INSTALLED_GAMES}</strong></td>
</tr>
<!-- IF not .installed -->
    <tr>
        <td class="row1" colspan="3" style="text-align: center;">{L_NO_INSTALLED_GAMES}</td>
    </tr>
<!-- ENDIF -->
<!-- BEGIN installed -->
<tr>
    <td><strong>{installed.GAME_NAME}</strong></a></td>
    <td style="text-align: center;"><a href="{installed.U_DETAILS}">{L_DETAILS}</a></td>
    <td style="text-align: center;"><a href="{installed.U_UNINSTALL}">{L_UNINSTALL}</a></td>
</tr>
<!-- END installed -->
<tr>
    <td class="row3" colspan="3"><strong>{L_UNINSTALLED_GAMES}</strong></td>
</tr>
<!-- IF not .uninstalled -->
<tr>
    <td class="row1" colspan="3" style="text-align: center;">{L_NO_UNINSTALLED_GAMES}</td>
</tr>
<!-- ENDIF -->
<!-- BEGIN uninstalled -->
<tr>
    <td><strong>{uninstalled.GAME_NAME}</strong></a></td>
    <td style="text-align: center;"><a href="{uninstalled.U_DETAILS}">{L_DETAILS}</a></td>
    <td style="text-align: center;"><a href="{uninstalled.U_INSTALL}">{L_INSTALL}</a> | <a href="{uninstalled.U_DELETE}">{L_DELETE}</a></td>
</tr>
<!-- END uninstalled -->
</tbody>
</table>

Mardocréu · Agosto 16, 2012

Alguém pode ajudar com isso por favor? :blink:

Nosreve · Agosto 19, 2012

não sei se é bem isso que tu queres, mas pra alterar a cor de cada linha crie uma classe pra cada uma, e defina a cor de background

segue exemplo

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
    <style type="text/css">
        .linha1{
            background-color:#0099FF;
        }
        .linha2{
            background-color:#009900;
        }
        p{
            width:200px;
        }
    </style>
</head>

<body>
    <table cellspacing="0">
        <tr class="linha1">
            <td><p>conteudo</p></td>
        </tr>
        <tr class="linha2">
            <td><p>conteudo</p></td>
        </tr>
        <tr class="linha1">
            <td><p>conteudo</p></td>
        </tr>
        <tr class="linha2">
            <td><p>conteudo</p></td>
        </tr>
    </table>
</body>
</html>

Mardocréu · Agosto 19, 2012

Obrigado Nosreve, eu não entendo nada de CSS nem HTML mas vou tentar.

Vicente Maldonado · Novembro 21, 2023

Para ser honesto, não há nada de errado com isso)))

Entrar

Tabela com as cores das linhas alternadas

Pergunta

Mardocréu

Link para o comentário

Compartilhar em outros sites

4 respostass a esta questão

Posts Recomendados

Mardocréu

Link para o comentário

Compartilhar em outros sites

Nosreve

Link para o comentário

Compartilhar em outros sites

Mardocréu

Link para o comentário

Compartilhar em outros sites

Vicente Maldonado

Link para o comentário

Compartilhar em outros sites

Participe da discussão

Estatísticas dos Fóruns

Navegação

Atividades