jueves, 30 de agosto de 2012

HTML: tablas 3

Encabezado de columna <th>

Las etiquetas <td> y </td> se utilizan para definir las celdas de cada una de las filas, pero podemos poner en su lugar las etiquetas <th> y </th>.
Para la etiqueta <th> es posible especificar los mismos atributos que para la etiqueta <td>, pero esta nueva etiqueta hace que el texto de la celda aparezca centrado y en negrita, por lo que se utiliza para definir los encabezados o títulos de las columnas.

Por ejemplo, si escribiéramos el siguiente código:



<table width="50%" border="1" align="center">
<tr>
<th>Sabado</td><th>Domingo</td>
</tr>
<tr>
<td>Curso HTML</td><td>Curso Dreamweaver</td>
</tr>
<tr>
<td>Curso Frontpage</td><td>Curso Flash</td>
</tr>
</table>


Obtendríamos la siguiente tabla:

SabadoDomingo
Curso HTMLCurso Dreamweaver
Curso FrontpageCurso Flash


Título de tabla <caption>

No solamente es posible establecer títulos para las columnas, también es posible establecer un título para la tabla mediante las etiquetas <caption> y </caption>.

Estas etiquetas han de ir después de la etiqueta <table>, y puede especificarse el valor de los atributos align (con los valores bottom, center, left, right y top) y valign (con los valores bottom y top).

Por ejemplo, si escribiéramos el siguiente código se obtendría la tabla de abajo:

<table width="50%" border="1" align="center">
<caption align="right" valign="top">Titulo de la tabla<tr>
<tr>
<th>Sabado</td>
...
</tr>
</table>



El título aparece ajustado a la margen derecho de la tabla (align="right") y encima de la tabla (valign="top").

No hay comentarios:

Publicar un comentario