Tablas

Tablas

Las tablas son una herramienta potente para presentar datos e imágenes en páginas HTML. Las tablas proporcionan a los diseñadores Web formas de añadir estructura vertical y horizontal a una página. Utilice las tablas para presentar datos tabulares, diseñar columnas o disponer texto o gráficos en una página Web. 

Podrá agregar contenido; añadir, eliminar, dividir y combinar filas y columnas; modificar las propiedades de tablas, de filas o de celdas para añadir color y alineaciones, así como copiar y pegar celdas.

Las tablas constan de tres componentes básicos:

• Filas: Espacio horizontal.
• Columnas: Espacio vertical.
• Celdas: Los contenedores que se originan en las intersecciones de las filas y las columnas.
  

  
  

  

Insertar una tabla

Para insertar una tabla:

1. Lleve a cabo una de estas operaciones:

• Sitúe el punto de inserción en el lugar de la ventana de documento donde desea que aparezca la tabla y haga clic en el botón Tabla  de la categoría Común, en el panel Objetos, o elija Insertar > Tabla.
• Arrastre el botón Tabla desde el panel Objetos hasta la posición deseada de la página.
  
  En ambos casos aparecerá el cuadro de diálogo "Insertar tabla".

2. Acepte los valores actuales de este cuadro de diálogo o escriba otros nuevos.
   
   Nota: El cuadro de diálogo "Insertar tabla" mantiene los valores de la configuración más reciente introducida para una tabla.

• En el campo Filas, especifique el número de filas de la tabla.
• En el campo Columnas, especifique el número de columnas de la tabla.
• En el campo relleno de celda, especifique el número de píxeles que habrá entre el contenido de la celda y el límite de ésta. El valor predeterminado de relleno es 1 píxel. Introduzca 0 para especificar que no desea relleno.
• En el campo espacio de celda, especifique el número de píxeles que debe haber entre las celdas de la tabla. El valor predeterminado es 2 píxeles. Introduzca 0 para especificar que no desea espaciado.
• En el campo ancho, especifique el ancho de la tabla como un número de píxeles o como porcentaje de la ventana del navegador.
• En el campo borde, especifique el ancho en píxeles del borde de la tabla. Introduzca cero (0) si no desea que la tabla tenga borde.

3. Haga clic en Aceptar para crear la tabla.

Seleccionar elementos de tabla 

Con un solo movimiento puede seleccionar toda la tabla, una fila, una columna o un rango contiguo de celdas dentro de la tabla.

Para seleccionar toda la tabla, lleve a cabo una de estas operaciones:

• Haga clic en la esquina superior izquierda de la tabla o en cualquier punto del borde derecho o inferior.
• Haga clic en la tabla y elija Modificar > Tabla > Seleccionar tabla.
• Haga clic en la tabla y elija Edición > Seleccionar todo.
• Sitúe el punto de inserción en cualquier lugar dentro de la tabla y seleccione la etiqueta <table> en el selector de etiquetas situado en la esquina inferior izquierda de la ventana de documento.
  
  Aparecerán manejadores de selección alrededor de la tabla cuando ésta esté seleccionada.
  
  
  

Para seleccionar filas o columnas:

• Sitúe el punto de inserción en el margen izquierdo de una fila o en la parte superior de una columna. Haga clic cuando aparezca la flecha de selección.

Para seleccionar una o varias celdas:

• Haga clic en una celda o arrastre en horizontal o en vertical para seleccionar varias filas o columnas.

Propiedades de las tablas

El inspector de propiedades muestra las propiedades de tabla cuando hay una tabla seleccionada.

Especificar las propiedades de una tabla:

1. Seleccione la tabla.
2. Haga clic en la flecha de ampliación, situada en la esquina inferior derecha del inspector de propiedades, para ver todas las propiedades.

• En el campo Tabla, introduzca un nombre para la tabla.
• En los campos Filas y Cols, especifique el número de filas y columnas de la tabla.
• En los campos An y Al, especifique el ancho y el alto de la tabla como un número de píxeles o como porcentaje de la ventana del navegador. Normalmente no es preciso especificar el alto de una tabla.
• Utilice el campo Alinear para especificar cómo debe alinearse una tabla con otros elementos del mismo párrafo, como pueden ser texto o imágenes. También puede elegir la alineación predeterminada del navegador.
• Utilice los botones Borrar alto de fila  y Borrar ancho de columna  para borrar todos los valores de alto de fila y ancho de columna de la tabla.
• Utilice el botón Convertir ancho de tabla a píxeles  para convertir el ancho de la tabla expresada en forma de porcentaje de la ventana del navegador a su ancho actual expresado en píxeles.
• Utilice el botón Convertir ancho de tabla a porcentaje 
•  para convertir el ancho de la tabla expresado en píxeles a un porcentaje de la ventana del navegador.

Para establecer el relleno y el espaciado de las celdas

• En el campo Rell. celda, especifique el número de píxeles que habrá entre el contenido de la celda y el límite de ésta.
• En el campo Esp. celda, especifique el número de píxeles que debe haber entre las celdas de la tabla. Nota:Cuando no se asignan valores específicos de espaciado y relleno de celda, Netscape Navigator, Microsoft Internet Explorer y Dreamweaver muestran la tabla como si el espaciado de celda fuera 2 y el relleno de celda fuera 1.

Para establecer los bordes de la tabla dispone de las siguientes opciones:

• En el campo Borde, especifique el ancho del borde de la tabla en píxeles. La mayoría de los navegadores muestran el borde como una línea tridimensional.

Si utiliza la tabla para la disposición de la página, especifique 0 como valor de borde. Para ver los límites de celda y tabla cuando el borde está definido como 0, elija Ver > Ayudas visuales > Bordes de tabla.

• Utilice el campo Col. borde para seleccionar un color de borde para toda la tabla.
• Utilice las opciones Color fondo para establecer la imagen de fondo o el color de fondo de la tabla.
• Utilice el campo Im. fondo para establecer la imagen de fondo de la tabla.

Aplicar formato a una fila, una columna o una celda

1. Seleccione cualquier combinación de celdas de la tabla.
2. Haga clic en la flecha de ampliación que se encuentra en la esquina inferior derecha del inspector de propiedades para ver todas las propiedades de las celdas.
   
   

   
   
3. Dispone de las siguientes opciones de apariencia

• Utilice el menú emergente Horiz para configurar la alineación horizontal del contenido de una celda, una columna o una fila. Puede alinear el contenido a la izquierda, a la derecha o al centro, o bien con el valor predeterminado del navegador (generalmente a la izquierda para celdas normales y centro para celdas de encabezado).
• Utilice el menú emergente Vert para configurar la alineación vertical del contenido de una celda, una columna o una fila. Puede alinear el contenido con la parte superior, media, inferior, con la línea de base o con el valor predeterminado del navegador (generalmente alineación al medio).
• En los campos An y Al, especifique en píxeles el ancho y el alto de las celdas seleccionadas. Para usar porcentajes, introduzca el símbolo de porcentaje (%) tras el valor.
• Para definir una imagen de fondo para una celda, columna o fila, utilice el campo Fnd. Haga clic en el icono de carpeta  para localizar una imagen. También puede escribir la ruta de la imagen o utilizar el ícono de señalización.
• Para definir el color de fondo para una celda, columna o fila, utilice el campo Fnd. Puede utilizar el selector de colores o escribir el código hexadecimal correspondiente al color deseado.
• Para establecer un color de borde para las celdas, utilice la opción Borde.

4. Dispone de las siguientes opciones de disposición

• Haga clic en el botón Combinar celdas  para combinar las celdas, filas o columnas seleccionadas y crear una celda.
• Haga clic en el botón Dividir celda  para dividir una celda y convertirla en dos celdas. Consulte "Dividir y combinar celdas".
• Seleccione No aj. para evitar que se ajuste el texto. Esto hace que las celdas sean más anchas para dar cabida a todos los datos conforme los escribe o los pega en una celda. (Generalmente, las celdas se amplían en horizontal para dar cabida a la palabra más larga y, a continuación, se amplían en vertical.)
• Seleccione Encab. para aplicar formato de encabezado de tabla a las celdas o filas seleccionadas. El contenido de las celdas de encabezado de la tabla aparece en negrita y centrado de forma predeterminada.

Dividir y Combinar Celdas

Puede combinar cualquier número de celdas adyacentes siempre que la selección entera tenga forma rectangular para obtener una sola celda que se extienda por varias columnas o filas. Puede dividir una celda en varias filas o columnas, independientemente de si anteriormente se había combinado.

En la ilustración siguiente, las celdas en la mitad de las dos primeras columnas se han combinado para ocupar dos filas.

Para combinar dos o más celdas en una tabla

1. Seleccione las celdas que desea combinar. Las celdas seleccionadas deberán ser contiguas y tener forma rectangular.
   

   
   
2. Elija Modificar > Tabla > Combinar celdas o haga clic en el botón Combinar celdas del inspector de propiedades.
   
   El contenido de las celdas individuales se sitúa en la celda combinada resultante. Las propiedades de la primera celda seleccionada se aplicarán a la celda combinada.
   
   Para dividir una celda combinada

1. Haga clic en la celda o seleccione una celda.
2. Elija Modificar > Tabla > Dividir celda o haga clic en el botón Dividir celda del inspector de propiedades.

3. En el cuadro de diálogo Dividir celda, elija si desea dividir la celda en filas o en columnas y, a continuación, introduzca el número de filas o columnas.

Cambiar el tamaño de tablas y celdas

Puede cambiar el tamaño de una tabla completa o de filas y columnas individuales. Al cambiar el tamaño de toda la tabla, todas sus celdas cambiarán proporcionalmente.

Para cambiar el tamaño de la tabla

1. Seleccione la tabla.
2. Arrastre uno de los manejadores de selección para cambiar el tamaño de la tabla en esa dimensión. Al arrastrar el manejador de la esquina se cambian ambas dimensiones.

Para cambiar el tamaño de una fila o una columna

1. Para cambiar el alto de la fila, arrastre el borde inferior de la fila.
2. Para cambiar el ancho de la columna, arrastre el borde derecho de la columna.
   

Cambiar el ancho de una columna

El Inspector de propiedades permite especificar el ancho de una columna de tres formas distintas. 

Para establecer el ancho de la columna

1. Haga clic en una de las celdas de la columna o seleccione la columna.
2. Elija Ventana > Propiedades para abrir el Inspector de propiedades.
3. En el campo An, lleve a cabo una de estas operaciones:
   • Introduzca un número para establecer el ancho de la columna de acuerdo con el valor especificado en píxeles.
   • Introduzca un número seguido de un símbolo de porcentaje (%) para establecer la columna como porcentaje del ancho de la tabla.
   • Deje el campo en blanco (predeterminado) para permitir que el navegador y Dreamweaver determinen el ancho adecuado de acuerdo con el contenido de la celda y del ancho de las otras columnas.

Para añadir filas o columnas

1. Haga clic en una celda donde desea que aparezca la nueva fila o columna.
2. Lleve a cabo una de estas operaciones: 
   • Para añadir una fila, elija Modificar > Tabla > Insertar fila o elija Tabla > Insertar fila en el menú contextual (éste aparece al hacer clic derecho dentro de una casilla).
   • Para añadir una columna, elija Modificar > Tabla > Insertar columna o elija Tabla > Insertar columna en el menú contextual.
   • Para añadir filas y columnas, elija Modificar > Tabla > Insertar filas o columnas, o elija Tabla > Insertar filas o columnas en el menú contextual.
   
   
3. En el cuadro de diálogo que aparece a continuación, introduzca el número de filas o columnas que desea añadir y especifique si las nuevas filas o columnas deben aparecer antes o después de la fila o columna seleccionada.

4. Haga clic en Aceptar

Para eliminar una fila o una columna:

1. Haga clic en una celda de la fila o la columna que desea eliminar.
2. Elija una de las siguientes opciones:
   
   
   • Para eliminar una fila, elija Modificar > Tabla > Eliminar fila o elija Tabla > Eliminar fila en el menú contextual.
   • Para eliminar una columna, elija Modificar > Tabla > Eliminar columna o elija Tabla > Eliminar columna en el menú contextual.

Añadir o eliminar filas o columnas de las partes inferior y derecha de una tabla

1. Seleccione toda la tabla.
2. En el inspector de propiedades, lleve a cabo una de estas operaciones:
   
   
   • Aumente el valor de fila o columna para añadir filas.
   • Reduzca el valor de fila o columna para eliminar filas.
   
   Dreamweaver añade o elimina filas desde la parte inferior de la tabla y añade y elimina columnas desde la derecha. Dreamweaver no avisa si las filas o las columnas que desea eliminar contienen datos.

Anidar Tablas

Una tabla anidada es una tabla que está dentro de otra tabla. Puede configurar una tabla anidada como cualquier otra tabla, no obstante, su ancho vendrá limitado por el ancho de la celda en la que aparece.

Para anidar una tabla en una celda de otra tabla

1. Lleve a cabo una de estas operaciones:
   
   
   • Haga clic en la celda donde desea que aparezca la segunda tabla y elija Insertar > Tabla.
   • Haga clic en la celda donde desea insertar la segunda tabla.
   • Arrastre el botón "Tabla" de la categoría Común, en el panel Objetos, hasta la celda donde desea insertar la segunda tabla.
2. Especifique las propiedades de la tabla en el cuadro de diálogo Insertar tabla y haga clic en Aceptar.

Copiar y pegar celdas

Puede copiar y pegar al mismo tiempo varias celdas de una tabla conservando su formato o copiar y pegar únicamente el contenido de la celda.

Las celdas se pueden pegar en un punto de inserción o en el lugar de una selección en una tabla existente. Para pegar varias celdas de una tabla, el contenido del Portapapeles debe ser compatible con la estructura de la tabla o la selección de la tabla en la que se va a pegar.

Para cortar o copiar celdas en una tabla

1. Seleccione una o más celdas de la tabla. 
•  Para cortar o copiar celdas, la selección debe tener forma rectangular

2. Corte o copie las celdas utilizando los comandos del menú Edición.
   
   Si selecciona toda una fila o columna y elige Edición > Cortar, la fila o la columna desaparecerán de la tabla.

Para pegar celdas de tabla

1. Elija dónde desea pegar las celdas.
   
   
   • Para pegar celdas antes o encima de una celda concreta, haga clic en dicha celda.
   • Para crear una tabla nueva con las celdas pegadas, haga clic en el lugar en el que desea que aparezca la tabla (siempre que no sea dentro de otra tabla). 
   • 
     
2. Elija Edición > Pegar.
   
   Si pega filas o columnas completas en una tabla existente, éstas se añadirán a la tabla. Si pega una celda individual, se reemplazará el contenido de la celda seleccionada. Si pega fuera de una tabla, las filas, columnas o celdas se utilizarán para definir una tabla nueva.

Para eliminar el contenido y dejar las celdas intactas

1. Seleccione una o más celdas.
2. Elija Edición > Borrar o presione Supr.
   Nota: Si selecciona todas las celdas de una fila o una columna, la fila o la columna (no sólo su contenido) se eliminarán de la tabla.
   
     http://www.youtube.com/watch?v=--F4CuzN7JM
   
   
   

   
   

   http://aprendeenlinea.udea.edu.co/lms/moodle/mod/resource/view.php?id=13243