CATEGORIAS

Tabela zebrada em PHP

Sempre vejo em foruns e em comunidades de redes sociais dúvidas de como fazer uma tabela zebrada, aquela na qual as cores linhas ficam alternadas para facilitar a visualização(cor-sim, cor-não).
Explicarei com fazer isso de forma rapida e simples.



Nossa tabela zebrada terá um recurso visual a mais, o destaque das linhas quando passar o mouse sobre ela, esse efeito será gerado sem Javascript, somente com CSS.
Para que o efeito de destaque funcione, é obrigatório a declaração do DOCTYPE.
O truque para “zebrar” a tabela consiste em verificar se a linha atual é par ou ímpar,
isso é feito de forma bem simples usando o operador ternário do PHP, ele é muito útil mas é pouco usado pela maioria das pessoas

$cor=($linha%2)?"cor-sim":"cor-nao";
 
Onde a variável $linha é um contador que vai identificar a linha atual,
a variável $cor terá a classe CSS que definirá a cor da linha

<!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” xml:lang=“pt-br” lang=“pt-br”>
<head>
<meta http-equiv=“Content-Type” content=“text/html; charset=utf-8″ />
<meta http-equiv=“content-language” content=“pt-br” />
<title>tabela zebrada</title>
<style type=“text/css”>
.cor-sim{
background-color: #DDEEFF;
}

.cor-nao{
background-color: #BBDDFF;
}

.cor-sim:hover,.cor-nao:hover{
background-color:#2291FF;
}

</style>
</head>
<body>

<table border=“0″ cellspacing=“0″ width=“50%”>

<?php

error_reporting(false);
// usei loop com FOR, mas pode ser um loop com resultado
// de uma consulta ao banco de dados
for($c=0;$c<30;$c++){


// variavel para contar as linhas
$linha++;


// o segredo é essa linha, ela verifica se a linha é PAR ou IMPAR
// e define a variavel com a classe CSS correspondente
$cor=($linha%2)?“cor-sim”:“cor-nao”;

// agora é so mostrar o resultado
echo “<tr class=\”$cor\”><td>linha $c</td></tr>\n;


}// fim do loop
?>
</table>

</body>
</html>






veja o resultado: