Vimos no capítulo anterior que as tabelas estão compostas de linhas que, por sua vez, contém células. As células são delimitadas pelas etiquetas <td> ou pelas etiquetas <th> (se queremos texto em negrito e centralizado) e constituem um entorno independente do resto do documento. Isto quer dizer que:

• Podemos usar praticamente qualquer tipo de etiqueta dentro da etiqueta <td> para, desta forma, dar forma a seu conteúdo.
• As etiquetas situadas no interior da célula não modificam o resto do documento.
• As etiquetas de fora da célula não são tidas em conta por esta.

Sendo assim, podemos especificar o formato de nossas células a partir de etiquetas introduzidas em seu interior ou mediante atributos colocados dentro da etiqueta de célula <td> ou também, em alguns casos, dentro da etiqueta <tr>, se desejamos que o atributo seja válido para toda a linha. A forma mais útil e atual de dar forma às células é a partir das folhas de estilo em cascata que já teremos a oportunidade de abordar mais adiante.

Vemos em seguida alguns atributos úteis para a construção de nossas tabelas. Começamos vendo alguns atributos que nos permite modificar uma célula em concreto ou toda uma linha.

align Justifica o texto da célula da mesma forma que se fosse o de um parágrafo.

valign Podemos escolher se queremos que o texto apareça acima (top), no centro (middle) ou abaixo (bottom) da célula.

bgcolor Dá cor à célula ou escolha de linha.

bordercolor Define a cor da borda.

Outros atributos que podem ser unicamente atribuídos a uma célula e não ao um conjunto de células de uma linha são:

background Permite-nos colocar um fundo para a célula a partir de um link a uma imagem.

height Define a altura da célula em pixels ou porcentagem.

width Define a largura da célula em pixels ou porcentagem

colspan Expande um célula horizontalmente.

rowspan Expande um célula verticalmente.

Nota: O atributo height não funciona em todos os navegadores, ademais, seu uso não está muito estendido. As células em geral, têm a altura que necessitam para caber todo o conteúdo que tenha inserido, ou seja, crescem o suficiente para que caiba o que colocamos dentro. O atributo width sim que funciona em todos os navegadores e deve ser utilizado constantemente. Se lhe atribuímos uma largura à célula, a largura será respeitada e se a tal célula tiver muito texto ou qualquer outro conteúdo, a célula crescerá um tanto para baixo quanto for o necessário para caber o que colocamos. Uma observação neste último parágrafo. Trata-se que se definimos uma célula de uma largura 100, por exemplo e colocamos na célula um conteúdo como uma imagem que meça mais de 100 pixels, a célula crescerá em horizontalmente tanto quanto for necessário para que a imagem caiba. Se o elemento, mesmo mais largo, fosse divisível (como um texto) a largura seria respeitada e o texto cresceria para baixo, ou o que é o mesmo, em altura, como assinalamos no parágrafo anterior.

Estes últimos quatro atributos descritos são de grande utilidade. Concretamente, height e width nos ajudam a definir as dimensões de nossas células de uma forma absoluta (em pixel ou em pontos de tela) ou de uma forma relativa, ou seja, por porcentagens referentes ao tamanho total da tabela.

Por exemplo:

<td width="80">
Dará uma largura de 80 pixels à célula. Entretanto,

<td width =80%>
Dará uma largura à célula do 80% da largura da tabela.

Há de ter em conta que, definidas as dimensões das células, o navegador vai fazer o que bondosamente puder para satisfazer ao programador. Isto quer dizer que pode que em algumas ocasiões o resultado que obtenhamos não seja o esperado. Concretamente, se o texto apresenta uma palavra excessivamente comprida pode que a largura da célula se veja aumentada para manter a palavra na mesma linha. Por outro lado, se o texto é muito grande , a célula aumentará sua para poder mostrar todo o seu conteúdo.

Analogamente se, por exemplo, definimos duas larguras distintas às células de uma mesma coluna, o navegador não saber qual atender. É por isso que é conveniente ter bem claro desde o princípio como é a tabela que queremos desenhar. Não é demais saber se pré-desenhamos no papel se a complexidade é importante. O HTML em geral é fácil, mas as tabelas podem converte-se em um verdadeiro quebra-cabeça se não chegamos a compreende-las devidamente.

Os atributos rowspan e colspan são também utilizados freqüentemente. Graças a isso é possível expandir células fundindo estas com suas vizinhas. O valor que podem tomar estas etiquetas é numérico. O número representa a quantidade de células fundidas.

Assim,
<td colspan="2">
Fundirá a célula em questão com sua vizinha direita.

Esta célula tem um colspan="2"
Célula normal	Outra célula

Do mesmo modo,
<td rowspan="2">

Esta célula tem rowspan="2", por isso tem fundida a célula abaixo.	Célula Normal
	Outra célula normal

A célula expandirá para baixo fundindo-se com a célula inferior.

O resto dos atributos apresentados apresenta uma utilidade e um uso bastante óbvio. Por isso, os deixamos a sua própria investigação.