Saltar apartados

Uso de las tablas en el editor

En este documento:

Botones para el uso de tablas.

Creación y propiedades de tablas:

Operaciones sobre filas:

Operaciones sobre columnas:

Operaciones sobre celdas:

Plantillas para quitar tablas

 

Insertar nueva tabla

Icono nueva tablaEl uso de las tablas se debe reducir a lo imprescindible, y nunca se deben usar para maquetar el contenido de nuestra página. Un ejemplo de uso correcto de las tablas sería por ejemplo un listado de Alumnos con su nombre y sus notas:

Notas de alumnos
 Alumno  Prácticas  Examen  NOTA FINAL
 Alumno 1  6  4  5
 Alumno 2  6  8  7
 Alumno 3  n.p.  8  n.p.
 Alumno 4  9  9  9

Cada vez que pulsamos Insertar Nueva tabla, nos aparece un cuadro donde podemos establecer:

  • Filas y Cols: el número de filas y columnas.
  • Alineación: la alineación dentro del documento.
  • Borde: el tamaño del borde de cada celda,
  • Resumen: un resumen (obligatorio) descriptivo de la información de la tabla (el cuál podemos usar a su vez como pie de tabla), y por último,
  • Formatos de tabla: alguno de los diseños de tabla predeterminados.

En la imagen a continuación podemos ver las opciones seleccionadas para el ejemplo anterior:

Ejemplo diálogo insertar nueva tabla

 

Al pulsar "Insertar" nos aparece la tabla vacía pero con el formato indicado.

Formatos de tabla

En este subapartado explicaremos qué tipos de formato y disposición podemos elegir y también como quitarlo. Sean las opciones disponibles las que se muestran en el diálogo de Insertar/Modificar tabla:

Formatos de tabla numerados

  1. Cabecera con fondo en azul oscuro y resto en azul claro.
  2. Cabecera con fondo en azul oscuro y resto en blanco.
  3. Cabecera con fondo en azul oscuro y resto en blanco y azul claro alternativamente.
  4. Cabecera de 1 celda con ancho de la tabla con fondo azul oscuro y el resto con fondo en azul claro.
  5. Cabecera compuesta por la primera fila y la primera celda de la segunda fila con fondo azul oscuro y el resto con fondo en azul claro.
  6. Cabecera formada por una única celda con el tamaño del alto de la tabla siendo la primera columna con fondo azul oscuro y el resto en azul claro.
  7. Cabecera formada por la primera columna con fondo azul oscuro y el resto en fondo blanco.
  8. Sin estilo: no pone estilo o quita el existente.

Propiedades de la tabla

Opción propiedades de la tablaPara ver las propiedades de la tabla nos situamos en cualquier celda de la tabla y mediante el uso del menú contextual que se abre al pulsar sobre el botón derecho del ratón ejecutamos esta acción. Nos aparece el mismo diálogo que "Insertar tabla" y que vemos a continuación:

Ejemplo diálogo insertar nueva tabla

Es importante recordar esta acción ya que al pegar tablas de páginas externas en VUALÀ es necesario especificar el campo Resumen para que se permita la publicación. Hay que poner el resumen de la tabla en los tres idiomas.

 

 

Propiedades de la fila

Icono propiedades de la filaMediante esta herramienta podemos cambiar el estilo y formato de las filas de nuestra tabla. Al pulsar sobre el botón de Propiedades de fila veremos la siguiente información:

Diálogo de propiedades de una filaDescribimos a continuación qué es cada opción:

  • Tipo de fila: permite cambiar el comportamiento de la fila. La fila podrá cambiar a los siguientes tipos:
    • Cabecera de la tabla: pasa a ser la cabecera ubicándose en lo alto de la tabla (si hubiera más de una fila de este tipo se dispondrán en el orden de asignación, es decir, la primera que fue cabecera quedará la primera, la segunda que se asignó quedará la segunda, etc...). Lo habitual (pero no es obligatorio) es que sólo exista una fila como cabecera.
    • Cuerpo de la fila: pasa a ser una fila normal situándose debajo de la cabecera.
    • Pie de la tabla: pasa a ser el pie de la tabla situándose en la parte inferior.
  • Alineación: alinea el contenido de las celdas a la posición indicada (izquierda, centro o derecha). Por defecto izquierda.
  • Alineación vertical: alinea el contenido de la celda en la posición vertical indicada (arriba, centrado o abajo). Por defecto centro.
  • Alto: lo usaremos para especificar un alto determinado para la tabla. El valor que toma la fila por defecto es el 26.
  • Imagen de fondo: no está implementado.
  • Color de fondo: permite seleccionar uno de los colores corporativos de la UA como fondo de la fila.

    Paleta de colores corporativa

La configuración de las propiedades se podrá aplicar a:

  • Sólo la fila actual
  • A las filas impares
  • A las filas pares
  • A todas las filas

En función de la opción que seleccionemos en el desplegable ubicado en la parte inferior izquierda del cuadro de diálogo, aquí se muestra su ubicación:

Desplegable para aplicación múltiple

Finalmente, pulsamos "Aplicar" para que se hagan efectivos los cambios.

 

Propiedades de la celda

Botón propiedades de la celdaLas propiedades de una celda se pueden modificar pulsando el botón de "Propiedades de la celda". Un diálogo con las opciones se nos abre y, a continuación, se detalla qué es cada opción:

Propiedades de la celdaEn la pestaña General disponemos de los siguientes parámetros:

  • Alineación: alinea el contenido de la celda a la posición indicada (izquierda, centro o derecha). Por defecto izquierda.
  • Alineación vertical: alinea el contenido de la celda en la posición vertical indicada (arriba, centrado o abajo). Por defecto centro.
  • Ancho: ancho de la celda.
  • Alto: alto de la celda
  • Tipo de celda: los tipos son
    • Datos: la celda toma el formato de celda normal.
    • Encabezado: la celda toma el formato de cabecera (el texto aparece más grande).
  • Imagen de fondo: no implementado.
  • Color del borde: permite cambiar el color del borde si existe.
  • Color de fondo: permite cambiar el color de fondo de la celda.

Los colores que se pueden asignar son los corporativos. En la siguiente imagen se muestra la paleta de colores:

Paleta de colores corporativa

Al igual que en las propiedades de la fila, podemos aplicar todos los cambios de forma múltiple. De este modo, mediante el desplegable de la parte inferior izquierda (y que se muestra a continuación) podremos extender la configuración de celda a:

  • La celda actual
  • Las celdas de la misma fila
  • Todas las celdas de la tabla

Lo vemos en esta imagen:

Desplegable para aplicación multiple de celdasFinalmente, pulsamos "Aplicar".

Eliminar una tabla

Opción Eliminar TablaPara eliminar una tabla nos situamos en cualquier celda de la tabla y mediante el uso del menú contextual que se abre al pulsar sobre el botón derecho del ratón ejecutamos esta acción. No se requiere confirmación, pero se puede deshacer (Ctrl+Z).

 

Recuerda:

Hay que usar el menú contextual asociado a la tabla haciendo clic-derecho en el ratón. No existe un botón en la barra de herramientas para eliminar tablas.

 

Insertar fila (antes)

Botón Insertar fila (antes)Permite modificar la estructura de la tabla insertando una nueva fila por encima de la fila en la cual tenemos el cursor.

La nueva fila adopta los estilos y formatos de la fila donde está ubicado el cursor.

Supongamos de nuevo el ejemplo de la tabla de alumnos. Si insertamos una nueva fila con el cursor en "Alumno 1" obtenemos la siguiente tabla:

Notas de alumnos
 Alumno  Prácticas  Examen  NOTA FINAL
       
 Alumno 1  6  4  5
 Alumno 2  6  8  7
 Alumno 3  n.p.  8  n.p.
 Alumno 4  9  9  9

Sin embargo, si lo hacemos en la cabecera, sobre la columna NOTA FINAL, el resultado sería:

Notas de alumnos
       
 Alumno  Prácticas  Examen  NOTA FINAL
 Alumno 1  6  4  5
 Alumno 2  6  8  7
 Alumno 3  n.p.  8  n.p.
 Alumno 4  9  9  9

 

Insertar fila (después)

Botón Insertar fila (después)

Su comportamiento es similar a insertar fila (antes) salvo en que la nueva fila insertada se ubica por debajo de la fila donde está ubicado el cursor.

 

 

 

 

Suprimir fila

Botón Eliminar fila

Suprime la fila en la cual está ubicado el cursor. Esta acción no pide confirmación, pero se puede deshacer (Ctrl+Z).

 

 

 

 

Insertar columna (antes)

Botón Insertar columna (antes)Permite modificar la estructura de la tabla insertando una nueva columna a la izquierda en la cual tenemos el cursor.

La nueva columna adopta los estilos y formatos de la columna donde está ubicado el cursor.

Supongamos de nuevo el ejemplo de la tabla de alumnos. Si insertamos una nueva columna para añadir la nota del un examen tipo test, no situamos en la columna de "Examen" e insertamos la nueva columna (antes):

Notas de alumnos
 Alumno  Prácticas    Examen  NOTA FINAL
 Alumno 1  6    4  5
 Alumno 2  6    8  7
 Alumno 3  n.p.    8  n.p.
 Alumno 4  9    9  9

 

Insertar columna (después)

Botón Insertar columna (después)

Su comportamiento es similar a insertar columna (antes) salvo en que la nueva columna insertada se ubica a la derecha de la columna donde está ubicado el cursor.

 

 

 

 

Suprimir columna

Botón eliminar columna

Suprime la columna en la cual está ubicado el cursor. Esta acción no pide confirmación, pero se puede deshacer (Ctrl+Z).

 

 

 

 

Vincular celdas

Botón Vincular celdasVincular celdas es la acción equivalente a combinar celdas en herramientas como Excel. Sin embargo la herramienta "Vincular celdas", al trabajar con código HTML (siendo esto trasparente para el usuario), tiene algunas limitaciones y, en caso de ser usada, se aconseja hacerlo despacio y con precaución para evitar efectos no deseados sobre la estructura de la tabla. En cualquier caso, se permite deshacer (Ctrl+Z).

Una resticción a la hora de vincular celdas es que la primera celda (tomando la más a izquierda y arriba) de la selección debe contener texto para que se active la herramienta "Vincular celdas".

La vinculación de celdas existe en algunos de los formatos de tabla (4, 5 y 6) que se pueden definir. Dicha vinculación ya viene establecida, y, se podría eliminar si se desea usando la herramienta "Dividir celdas" explicada en el apartado anterior.

Veamos un ejemplo de tabla con una fila combinada y una columna:

Notas de alumnos
 Alumno Convocatoria  Prácticas + Examen  NOTA FINAL
 Alumno 1 FEBRERO  6  2  4
JULIO  6  8  7
 Alumno 2 FEBRERO  n.p.  8  n.p.
JULIO  9  9  9

Sobre el ejemplo de la tabla con notas de alumnas hemos hecho algunas modificaciones. Las celdas de cabecera con el texto "Prácticas" y "Examen" se han vinculado para formar una única celda con el texto "Prácticas + Examen". Por otro lado, cada alumno tiene dos filas con sus notas de FEBRERO y JULIO. Para ello hemos vinculado dos celdas para formar una única con el nombre del alumno y que abarque las dos filas.

Las celdas combinadas mantienen el formato y estilo de la primera celda seleccionada (que, como se recuerda, debe tener texto). En nuestro ejemplo, se ha cambiado el color de fondo de las celdas afectadas usando la herramienta "Propiedades de celda" para que el usuario identifique las celdas vinculadas.

 

Dividir celdas

Botón dividir celdasAcción inversa a "Vincular celdas". Sólo se puede dividir aquellas celdas que previamente han sido vinculadas (o combinadas). Hay que situar el cursor sobre una celda vinculada (combinada) y pulsar "Dividir celdas". El efecto es que la estructura de la tabla recupera las celdas vinculadas (o combinadas) anteriormente.

Notas de alumnos
 Alumno Convocatoria  Prácticas + Examen  NOTA FINAL
 Alumno 1 FEBRERO  6  2  4
  JULIO  6  8  7
 Alumno 2 FEBRERO  n.p.  8  n.p.
JULIO  9  9  9

Sobre la tabla del ejemplo anterior hemos dividido la celda (previamente combinada de "Alumno 1". La tabla recupera la celda para esa fila. Se ha marcado en rojo las celdas afectadas usando las "Propiedades de la celda".

Servicio de Informática Gestor de contenidos Vualà


Universidad de Alicante
Carretera de San Vicente del Raspeig s/n
03690 San Vicente del Raspeig
Alicante (Spain)

Tel: (+34) 96 590 3400

Fax: (+34) 96 590 3464

Para más información: informacio@ua.es, y para temas relacionados con este servidor Web: webmaster@ua.es

Carretera San Vicente del Raspeig s/n - 03690 San Vicente del Raspeig - Alicante - Tel. 96 590 3400 - Fax 96 590 3464