Tamaños de tabla HTML
Las tablas HTML pueden tener diferentes tamaños para cada columna, fila o la tabla completa.
Utilice el styleatributo con las
propiedades widtho height
para especificar el tamaño de una tabla, fila o columna.
Ancho de la tabla HTML
Para establecer el ancho de una tabla, agregue el style
atributo al <table>elemento:
Ejemplo
Establezca el ancho de la tabla al 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 un porcentaje como unidad de tamaño para un ancho significa qué tan ancho será este elemento en comparación con su elemento principal, que en este caso es el <body>
elemento.
Ancho de columna de la tabla HTML
Para establecer el tamaño de una columna específica, agregue el style
atributo en un elemento <th>o
<td>:
Ejemplo
Establezca el ancho de la primera columna al 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 de fila de la tabla HTML
Para establecer la altura de una fila específica, agregue el style
atributo en un elemento de fila de la tabla:
Ejemplo
Establezca la altura de la segunda fila en 200 píxeles:
<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>