Está en la página 1de 3

¿Cómo se crean las tablas con html?

Escriba el código
html para una tabla de dos filas por dos columnas.

Dentro del lenguaje de diseño web, las tablas HTML se crean usando las
etiquetas <table> y </table>. En ella se incluyen dos etiquetas importantes: <tr>,
que es para crear filas de tablas y <td>, para crear celdas de datos. Todo lo que
esté dentro de ambas etiquetas es el contenido de la celda de la tabla. 

Entre otras etiquetas utilizadas al momento de trabajar con tablas HTML son:
<th>, para agregar encabezados, <caption>, para insertar subtítulos, <thead>
para añadir un encabezado separado a la tabla, <tbody>, que sirve para mostrar
el cuerpo inicial de la tabla y <tfoot>, para crear un pie de página separado de la
tabla.

El uso de tablas HTML en el diseño se ha vuelto muy común, pues las etiquetas
permiten la creación de contenido web de una forma menos compleja; lo
cual brinda más oportunidades de diseño.

Ejemplo
<table class="default">
<tr>
<td>Celda 1</td>
<td>Celda 2</td>
<td>Celda 3</td>
</tr>
<tr>
<td>Celda 4</td>
<td>Celda 5</td>
<td>Celda 6</td>
</tr>
</table>
¿Cómo se le da formato a una tabla con html (bordes,
ancho, alto, alineación, color de fondo, color de borde)?
Escriba el código html en donde se aplique formato a la
tabla del punto 1
A continuación encuentras los más importantes de los atributos específicos para
tablas, aunque recuerda que todos están ya en desuso desde la versión del
estándar HTML5.

align: Alinea horizontalmente la tabla con respecto a su entorno.


background: Nos permite colocar un fondo para la tabla a partir de un enlace a una
imagen.
bgcolor: Da color de fondo a la tabla.
border: Define el número de pixels del borde principal.
bordercolor: Define el color del borde.
cellpadding: Define, en pixels, el espacio entre los bordes de la celda y el
contenido de la misma.
cellspacing: Define el espacio entre los bordes (en pixels).
height: Define la altura de la tabla en pixels o porcentaje.
width: Define la anchura de la tabla en pixels o porcentaje.

Ejemplo
<table cellspacing="10" cellpadding="10" border="3">
<tr>
<td align="center">
Celda de la tabla principal
</td>
<td align="center">
<table cellspacing="2" cellpadding="2" border="1">
<tr>
<td>Tabla anidada, celda 1</td>
<td>Tabla anidada, celda 2</td>
</tr>
<tr>
<td>Tabla anidada, celda 3</td>
<td>Tabla anidada, celda 4</td>
</tr>
</table>
</td>
</tr>
</table>
3. ¿Cómo se le da formato a las celdas de una tabla
utilizando html (bordes, ancho, alto, alineación, color de
fondo, color de borde)? Escriba un ejemplo aplicando
formato a celda.

También podría gustarte