Etiqueta HTML `<tr>`

La etiqueta <tr> especifica una fila en una tabla HTML. Las celdas dentro de ella se definen usando <th> (una celda de encabezado) o <td> (una celda estándar). Tanto las etiquetas <td> como <th> admiten el atributo colspan para un control adicional sobre cómo las celdas se extienden o se ajustan a las columnas. Este atributo permite definir cuántas columnas de ancho debe tener la celda (siendo el valor predeterminado 1). Puedes usar el atributo rowspan en las celdas si deseas especificar que deben abarcar más de una fila.

Algunas tablas también pueden incluir los elementos <col>, <colgroup>, <caption>, <tfoot>, <tbody> y <thead>.

El elemento <tr> se declara dentro de la etiqueta <table>.

Cada fila puede contener un número diferente de celdas. El navegador renderiza exactamente las celdas especificadas en el marcado; no rellena automáticamente la fila con celdas vacías. Si necesitas dejar una celda vacía, simplemente crea un elemento <td> o <th> sin contenido.

éxito
Para personalizar la apariencia de la tabla, utiliza propiedades CSS.

Sintaxis

La etiqueta <tr> viene en pares. El contenido se escribe entre las etiquetas de apertura (<tr>) y cierre (</tr>).

Sintaxis de la etiqueta HTML <tr>

html

<table> 
  <tr> 
    <td>...</td> 
  </tr> 
</table>

Ejemplo de la etiqueta HTML `<tr>`:

Ejemplo de la etiqueta HTML <tr>

html

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
    <style>
      table {
        width: 80%;
        margin: 30px auto;
        border-collapse: collapse;
      }
      th,
      td {
        padding: 10px;
        border: 1px solid #666;
      }
    </style>
  </head>
  <body>
    <table>
      <tr>
        <th>Month</th>
        <th>Date</th>
      </tr>
      <tr>
        <td>March</td>
        <td>10.09.2018</td>
      </tr>
      <tr>
        <td>June</td>
        <td>18.07.2018</td>
      </tr>
    </table>
  </body>
</html>

Try it Yourself »

Resultado

ejemplo de tr

Atributos

Nota: Los siguientes atributos están obsoletos en HTML5 y no deben usarse en el desarrollo web moderno.

Atributo	Valor	Descripción
align	right left center justify char	Alinea el contenido en una fila de tabla. No compatible con HTML 5.
bgcolor	bgcolor	Especifica un color de fondo para una fila de tabla. No compatible con HTML 5.
bordercolor	bordercolor	Establece el color del borde. No compatible con HTML 5.
char	character	Alinea el contenido en una fila de tabla según un carácter. Solo se usa si el atributo es align="char". No compatible con HTML 5.
charoff	number	Establece el número de caracteres desde los cuales se alineará el contenido respecto al carácter especificado por el atributo char. Solo se usa si el atributo es align="char". No compatible con HTML 5.
valign	top middle bottom baseline	Especifica la alineación vertical del contenido dentro de una fila de tabla. No compatible con HTML 5.

La etiqueta <tr> admite los Atributos Globales y los Atributos de Eventos.

Cómo dar estilo a una etiqueta HTML <tr>

Práctica

¿Cuál es el propósito y uso de la etiqueta <tr> en HTML?

La etiqueta <tr> se utiliza para crear un nuevo párrafo.La etiqueta <tr> se utiliza para crear un bloque de texto.La etiqueta <tr> se utiliza para crear una nueva fila en una tabla.La etiqueta <tr> puede usarse con las etiquetas <th> y <td> para definir celdas en la fila.La etiqueta <tr> puede colocarse tanto dentro como fuera de la etiqueta <table>.

Etiqueta HTML <tr> ​

Sintaxis ​

Ejemplo de la etiqueta HTML <tr>: ​

Resultado ​