Curso completo de HTML - Celdas que abarcan varias filas o columnas

Es hora ya de comenzar con dos de los atributos más interesantes en la creación de tablas: ROWSPAN y COLSPAN. Gracias a estos atributos podremos crear tablas mucho más complejas y que se adapten a nuestras necesidades. Estos dos atributos sirven tanto para las celdas normales, TD, como para las celdas encabezado, TH, y su función será extender una fila (ROWSPAN) o una columna (COLSPAN) para que ocupen el tamaño de varias. Para comprender el significado del concepto extender lo mejor es ver un ejemplo:

      <TABLE BORDER="1">
       <TR>
       <TH COLSPAN="2">
       Celda de dos columnas
       </TH>
       </TR>
       <TR>
       <TD ROWSPAN="2">
       Celda de dos filas
       </TD>
       <TD>
       Fila2,Columna2
       </TD>
       </TR>
       <TR>
       <TD>
       Fila3,Columna2
       </TD>
       </TR>
       </TABLE>
 
     

En la figura 7.15 podemos ver la tabla resultado de este código:

como vemos la primera celda se extiende para ocupar dos columnas y la primera celda de la segunda fila ocupa dos filas. En este momento invitamos al lector a practicar con los atributos ROWSPAN y COLSPAN incluso con celdas de mayor tamaño, ya que esta es la mejor manera de habituarse a ellos, más adelante seguiremos realizando ejemplos prácticos con estos y otros atributos de las tablas.