Tag HTML th
Nota: Si no sabes lo que es un tag y/o cómo se debe utilizar, te recomendamos que leas nuestro tutorial "tags y atributos HTML" que puedes encontrar en nuestra sección de tutoriales HTML.
El tag
HTML th define una celda en una tabla (
tag HTML table) conteniendo información de encabezado para otras celdas regulares (
tag HTML td).
El atributo "id" asigna un identificador al elemento asociado. Este identificador debe ser único en el documento y puede ser usado para referirse a ese elemento.
Ejemplo:
Comienzo del código
<p id="parrafo1">Este es el primer párrafo nombrado parrafo1. Para cambiar dinámicamente las propiedades del mismo usa este identificador.</p>Fin del código
El atributo "class" asigna un nombre de clase (o una lista de nombres de clase separados por espacios) al elemento contenedor. Es usado con hojas de estilos e indica al navegador la clase a la cual el elemento está asociado. Una clase provee atributos visuales para los elementos.
Ejemplo:
Comienzo del código
<p class="referencias">Este artículo está basado en el libro "Viento en los árboles" por Jhon L. Brooks</p>
<p class="referencias importante">Este artículo está basado en el libro "Viento en los árboles" por Jhon L. Brooks... y es más importante que el anterior.</p>Fin del código
Define un estilo visual para el elemento. Es una mejor práctica definir atributos en hojas de estilos externas agrupándolos en clases. Los atributos en el parámetro "style" deben preservar este orden "nombre : valor" y ser separados por un punto y coma.
Si estás escribiendo
código XHTML te recomendamos no utilizar este atributo y probar con las clases de hojas de estilo (con el atributo "class").
Ejemplo:
Comienzo del código
<p style="color: #0000FF; font-size: 12pt">Este es un párrafo con un estilo definido</p>
<p>Y este es otro texto sin estilo.</p>Fin del código
Indica un título para el elemento. Usado para dar una descripción acerca del elemento que es usualmente mostrado como un "tool tip" cuando el usuario pone el puntero del mouse sobre el elemento.
Ejemplo:
Código |
Visualización |
<a title="HTMLQuick.com" href="http://www.htmlquick.com">Código HTML</a> |
Código HTML |
Especifica el lenguaje del contenido de un elemento. El valor predeterminado es "desconocido".
Al escribir
código XHTML la sintaxis "xml:lang" representa una alternativa preferida en XHTML 1.0 y un reemplazo en XHTML 1.1 (por ejemeplo, xml:lang="en").
Ejemplo:
Comienzo del código
<p lang="en">This is a paragraph in english.</p>
<p lang="es">Este es un párrafo en español.</p>Fin del código
dir
Especifica la dirección de texto del contenido y atributos del elemento, así como la direccionalidad de las tablas. Tiene dos valores posibles que son insensibles a mayúsculas/minúsculas:
- RTL: Derecha a izquierda.
- LTR: Izquierda a derecha.
Ejemplo:
Comienzo del código
<q lang="he" dir="rtl">...Una cita en Hebreo...</q>Fin del código
Define un color para ser usado como fondo.
align
Define la alineación del contenido de una celda. Puede ser uno de los siguientes valores (insensibles a mayúsculas/minúsculas):
- left: El contenido es alineado a la izquierda. Este es el valor predeterminado para celdas comunes (tag HTML td).
- center: El contenido es centrado. Este es el valor predeterminado para celdas de encabezado. (tag HTML th).
- right: El contenido es alineado a la izquierda.
- justify: Texto justificado.
- char: El texto es alineado alrededor de un carácter específico.
Ejemplo:
Código |
Visualización |
<table border="1" summary="Tabla ejemplo mostrando el uso del atributo align."> <tr><td style="width: 7.6em">Izquierda</td></tr> <tr><td style="width: 7.6em" align="center">Centrado</td></tr> <tr><td style="width: 7.6em" align="right">Derecha</td></tr> </table> |
Izquierda |
Centrado |
Derecha |
|
valign
Especifica la alineación vertical del contenido de una celda. Funciona exactamente como el atributo "align" pero para el espacio vertical. Los valores posibles son (insensibles a mayúsculas/minúsculas):
- top: El contenido es alineado arriba.
- middle: La información es centrada verticalmente. Este es el valor predeterminado.
- bottom: El contenido es alineado abajo.
- baseline: Todas las celdas en una fila que tienen esta alineación deberían tener su primera línea de texto en una línea base común a todas las celdas de una fila.
Ejemplo:
Código |
Visualización |
<table border="1" summary="Tabla ejemplo mostrando el uso del atributo valign."> <tr> <td>1<br />2<br />3<br />4</td> <td valign="top">23.065</td> <td>324.432</td> <td valign="bottom">45.8745</td> </tr> </table> |
1 2 3 4 |
23.065 |
324.432 |
45.8745 |
|
Especifica un carácter que actuará como eje para alinear el texto.
Nota: Los navegadores no están obligados a soportar esta característica.
Especifica el corrimiento de la primaera aparición del carácter de alineación en cada línea. Ten en cuanta la dirección del texto (dir).
Nota: Los navegadores no están obligados a soportar esta característica.
Contiene una lista separada por espacios de ids correspondientes a otras celdas que proveen información de encabezado para esta celda.
scope
Especifica un grupo de celdas para las cuales esta celda provee información de encabezado. Los valores posibles son (insensibles a mayúsculas/minúsculas):
- row: Toda la fila contenedora.
- col: Toda la columna contenedora.
- rowgroup: Todo el grupo de filas contenedor.
- colgroup: Todo el grupo de columnas contenedor.
Provee una versión abreviada del contenido de la celda que puede ser utilizada por navegadores en algunos casos en lugar del contenido mismo.
Agrupa celdas en categorías conceptuales que se puede considerar que formará ejes en un espacio n-dimensional. Los navegadores pueden proveer alguna funcionalidad para mostrar y relacionar estas categorías.
Especifica el número de filas unificadas por esta celda. El valor "0" significa que se unifican todas las celdas desde esta posición hasta la última fila en la sección contenedora (
tag HTML thead,
tag HTML tbody o
tag HTML tfoot).
Ejemplo:
Código |
Visualización |
<table border="1" summary="Tabla ejemplo mostrando el uso del atributo rowspan."> <tr><td rowspan="2">Celda1</td><td>Celda2</td></tr> <tr><td>Celda3</td></tr> </table> |
|
Especifica el número de columnas unificadas por esta celda. El valor "0" indica que se unifican todas celdas desde esta posición hasta la última columna en la sección contenedora (
tag HTML colgroup).
Ejemplo:
Código |
Visualización |
<table border="1" summary="Tabla ejemplo mostrando el uso del atributo colspan."> <tr><td>Celda1</td><td>Celda2</td></tr> <tr><td colspan="2">Celda3</td></tr> </table> |
|
wrap
Cuando está presente, este atributo indica al navegador no envolver automáticamente el contenido textual de esta celda.
Recuerda que los atributos booleanos deben ser definidos en la forma nombre_atributo="nombre_atributo" para ser compatibles con el
código XHTML.
Ofrece una pista acerca del ancho deseado para la celda. Los navegadores pueden cambiar el ancho de acuerdo al espacio disponible.
Ofrece una pista acerca de la altura deseada para la celda. Los navegadores pueden cambiar la altura de acuerdo al espacio disponible.
- onclick
- ondblclick
- onmousedown
- onmouseup
- onmouseover
- onmousemove
- onmouseout
- onkeypress
- onkeydown
- onkeyup
Lista completa e información acerca de
eventos en HTML
En este ejemplo definimos una tabla con columnas agrupadas, filas agrupadas y varios atributos para cada tag que definirán el estilo visual.
Código |
Visualización |
<table border="1" frame="border" rules="groups" summary="Funcionalidad de archivos HTML en diferentes versiones de Internet Explorer"> <caption>Representació de cómo archivos HTML funcionan en diferentes versiones de Internet Explorer</caption> <colgroup align="center"></colgroup> <colgroup></colgroup> <colgroup align="center" span="2"></colgroup> <thead> <tr> <th>Archivo</th> <th>Nombre</th> <th>4.0</th> <th>5.0</th> </tr> </thead> <tfoot> <tr> <th>Archivo</th> <th>Nombre</th> <th>4.0</th> <th>5.0</th> </tr> </tfoot> <tbody> <tr> <td>1</td> <td>index.html</td> <td>Ok</td> <td>Ok</td> </tr> <tr> <td>2</td> <td>links.html</td> <td>Ok</td> <td>Ok</td> </tr> <tr> <td>3</td> <td>fullfunc.html</td> <td>-</td> <td>Ok</td> </tr> <tr> <td>4</td> <td>nofunc.html</td> <td>Ok</td> <td>Ok</td> </tr> <tr> <td>5</td> <td>panel.html</td> <td>-</td> <td>Ok</td> </tr> </tbody> <tbody> <tr> <td>6</td> <td>search.php</td> <td>Ok</td> <td>Ok</td> </tr> <tr> <td>7</td> <td>send.php</td> <td>Ok</td> <td>Ok</td> </tr> </tbody> </table> |
Representació de cómo archivos HTML funcionan en diferentes versiones de Internet Explorer
Archivo |
Nombre |
4.0 |
5.0 |
Archivo |
Nombre |
4.0 |
5.0 |
1 |
index.html |
Ok |
Ok |
2 |
links.html |
Ok |
Ok |
3 |
fullfunc.html |
- |
Ok |
4 |
nofunc.html |
Ok |
Ok |
5 |
panel.html |
- |
Ok |
6 |
search.php |
Ok |
Ok |
7 |
send.php |
Ok |
Ok |
|