Formatação tabela HTML

6 respostas
F

Galera estou retornando dados de um banco para minha pagina jsp onde tenho uma tabela html, como faço para que os item ( cada linha ) fique formatada de cor diferente:
tipo branco e cinza?

6 Respostas

Mstanguine

Você vai ter que usar CSS.

Da uma olhada nesse tutorial:

http://maujor.com/tutorial/altrow.php

É mais ou menos isso?

Jair_Rillo_Junior

Simplesmente utilize CSS.

Você Provavelmente retorna os dados da aplicação Java em uma Collection e faz um “iterate” para montar as linhas (td) da table, assim, coloca uma regra simples para ver qual a linha e utilizar o estilo CSS apropriado.

Dá uma pesquisada no google sobre “html table css even odd”

L

Este ate majour explica

<!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=iso-8859-1" />
<title>Tutorial CSS - Tabelas</title>
<style type="text/css"> 
table#alter td {background:#FFFFCC;}
table#alter tr.dif td {background:#EEEEEE;}
</style>
</head>
<body>
<table border="1px" cellpadding="5px" cellspacing="0" id="alter">
  <tr> 
    <td>Célula 1-1 </td>
    <td>Célula 1-2</td>
    <td>Célula 1-3</td>
  </tr>
  <tr class="dif"> 
    <td>Célula 2-1 </td>
    <td>Célula 2-2</td>
    <td>Célula 2-3</td>
  </tr>
  <tr> 
    <td>Célula 3-1 </td>
    <td>Célula 3-2</td>
    <td>Célula 3-3</td>
  </tr>
  <tr class="dif"> 
    <td>Célula 4-1 </td>
    <td>Célula 4-2</td>
    <td>Célula 4-3</td>
  </tr>
  <tr> 
    <td>Célula 5-1 </td>
    <td>Célula 5-2</td>
    <td>Célula 5-3</td>
  </tr>
</table>
</body>
</html>
Master.Abs

O se preferir utilize pseudo-classe no css.

table tr td:nth-child(even){background: #EEE} //td’s pares
table tr td:nth-child(odd){background: #FFF} //td’s impares

yhhik

como vc está preenchendo a tabela?
com jstl?
se vc tá usando jstl, seria muito mais fácil zebrar a tabela com jstl.

F

Valeuu!!

Criado 8 de novembro de 2011
Ultima resposta 8 de nov. de 2011
Respostas 6
Participantes 6