Tabela Interior
Como criar tabelas dentro de colunas da tabela?
Como controlar o espaço entre as células da tabela?
Explicação
Tabela dentro de tabela
Muitas vezes nós iremos usar uma tabela dentro de tabelas Agora vamos criar duas linhas com três colunas. A linha 2, coluna 2 será dividida novamente para uma tabela com duas linhas, duas colunas. Iremos utilizar também os atributos cellpadding e cellspacing para lidar com o espaço da tabela.
Código de Exemplo: <table border=1 width=80% height=30% align=center cellpadding=1 cellspacing=1>
<tr height=30%>
<td>
Primeira Linha
</td>
<td>
Primeira Linha
</td>
<td>
Primeira Linha
</td>
</tr>
<tr height=70%>
<td>
Segunda Linha
</td>
<td >
<table bgcolor=yellow border=1 width=80% height=80%>
<tr >
<td> Tabela Interior </td>
<td> Tabela Interior </td>
</tr>
<tr >
<td> Tabela Interior </td>
<td> Tabela Interior </td>
</tr>
</table>
</td>
<td>
Segunda Linha
</td>
</tr>
</table>
Result: Primeira Linha | Primeira Linha | Primeira Linha |
Segunda Linha | Tabela Interior | Tabela Interior | Tabela Interior | Tabela Interior | | Segunda Linha |
Cellpadding e Cellspacing
O espaço e o preenchimento pode ser controlado usando os atributos cellpadding e cellspacing.
Uso:
<table border=0 bgcolor="#776655" width=80% height=150 align=center cellpadding=0 cellspacing=0>
A tabela acima pode tornar-se mais elegante, mudando as cores e os contornos e controlar o cellspacing e cellpadding.
Resultado: Primeira Linha | Primeira Linha | Primeira Linha |
Segunda Linha | | Segunda Linha |