Cómo combinar o combinar celdas en una tabla HTML

Puede combinar dos o más celdas de la tabla usando el atributo colspan en una Etiqueta HTML (datos de la tabla). Por ejemplo, en el siguiente código hay una tabla con tres filas y tres columnas.

Si quisiéramos combinar las dos primeras celdas en una celda, podríamos usar el atributo colspan = "2" en la primera etiqueta. El número representa la cantidad de celdas que desea usar para el etiqueta.

Ejemplo de tabla HTML

El código anterior, representado en un navegador web, produce una tabla similar a la tabla que se muestra a continuación. Como puede ver, la primera celda abarca el ancho de dos columnas.

Para usar las tres celdas en la parte superior de la tabla, aumente el valor de colspan a 3 ya que hay tres columnas. Si aumenta el valor a 3, obtendrá una tabla similar al ejemplo que se muestra a continuación.

Nota: asegúrese de que cuando expanda un Columna que eliminas del resto. etiqueta. En el ejemplo anterior, porque estamos usando las tres columnas, solo tenemos una en el (fila de la tabla).

Fusionar celdas usando un editor WYSIWYG

También puede usar el editor WYSIWYG para combinar celdas. Normalmente, esto se hace resaltando dos o más celdas, haciendo clic con el botón derecho en las celdas y luego seleccionando la opción para fusionar celdas. A continuación, se incluyen pasos adicionales sobre cómo hacer esto en Dreamweaver y Expression Web.

Fusionando celdas utilizando Dreamweaver

  1. Resalte dos o más celdas en su tabla.
  2. Haga clic derecho en las celdas resaltadas.
  3. Haga clic en Tabla y luego en Combinar celdas .

o

  1. Resalte dos o más celdas en su tabla.
  2. Presiona el atajo de teclado Alt + Ctrl + M.

Fusionar celdas utilizando Expression Web

  1. Resalte dos o más celdas en su tabla.
  2. Haga clic derecho en las celdas resaltadas.
  3. Haga clic en Modificar y luego en Combinar celdas .