Tamanhos de tabela HTML
As tabelas HTML podem ter tamanhos diferentes para cada coluna, linha ou toda a tabela.
Use o style
atributo com as
propriedades width
ou height
para especificar o tamanho de uma tabela, linha ou coluna.
Largura da Tabela HTML
Para definir a largura de uma tabela, adicione o style
atributo ao <table>
elemento:
Exemplo
Defina a largura da tabela para 100%:
<table style="width:100%">
<tr>
<th>Firstname</th>
<th>Lastname</th>
<th>Age</th>
</tr>
<tr>
<td>Jill</td>
<td>Smith</td>
<td>50</td>
</tr>
<tr>
<td>Eve</td>
<td>Jackson</td>
<td>94</td>
</tr>
</table>
Nota: Usar uma porcentagem como unidade de tamanho para uma largura significa quão largo este elemento será comparado ao seu elemento pai, que neste caso é o <body>
elemento.
Largura da Coluna da Tabela HTML
Para definir o tamanho de uma coluna específica, adicione o style
atributo em um <th>
ou
<td>
elemento:
Exemplo
Defina a largura da primeira coluna para 70%:
<table style="width:100%">
<tr>
<th style="width:70%">Firstname</th>
<th>Lastname</th>
<th>Age</th>
</tr>
<tr>
<td>Jill</td>
<td>Smith</td>
<td>50</td>
</tr>
<tr>
<td>Eve</td>
<td>Jackson</td>
<td>94</td>
</tr>
</table>
Altura da linha da tabela HTML
Para definir a altura de uma linha específica, adicione o style
atributo em um elemento de linha da tabela:
Exemplo
Defina a altura da segunda linha para 200 pixels:
<table style="width:100%">
<tr>
<th>Firstname</th>
<th>Lastname</th>
<th>Age</th>
</tr>
<tr style="height:200px">
<td>Jill</td>
<td>Smith</td>
<td>50</td>
</tr>
<tr>
<td>Eve</td>
<td>Jackson</td>
<td>94</td>
</tr>
</table>