Programa Adobe Dreamweaver CS6

Sesin de Aprendizaje

Diseo Web

Centro de Educacin Continua

Destino del Enlace

El destino del enlace determina en qu ventana va a ser abierta la pgina vinculada, puede variar dependiendo de si el
documento est basado en marcos.
Puede especificarse en el inspector de propiedades a travs de Dest, o en la ventana que aparece a travs del men Insertar,
opcin Hipervnculo.
_blank:
Abre el documento vinculado en una nueva ventana o pestaa del navegador.
_parent:
Abre el documento vinculado en la ventana del marco que contiene el vnculo o en el conjunto de marcos padre. Tiene sentido si se
emplean marcos.
_self:
Es la opcin predeterminada, y la que se produce si no indicamos otra cosa. Abre el documento vinculado en el mismo marco o ventana
que el vnculo.
_top:
Abre el documento vinculado en la ventana completa del navegador. Tiene sentido si se emplean marcos.
Si la pgina no usa marcos (lo habitual hoy en da) simplemente no especificaremos nada para abrirlo en la misma ventana, y emplearemos _blank
para abrir ventanas nuevas.
Lo habitual es abrir las los enlaces a pginas del sitio en la misma ventana, y los enlaces externos en ventanas nuevas. Otra tendencia dice que una
pgina nunca debera de abrir nuevas ventanas, y que debe de ser el usuario el que decida qu enlaces quiere abrir en ventanas nuevas. En la mayora de
navegadores, para abrir un enlace un una ventana nueva, basta con hacer clic con la ruedecilla del ratn.

Formato del enlace

En general, un texto que tiene asociado un vnculo suele aparecer subrayado. Al mismo tiempo, puede adquirir tres colores diferentes que pueden
especificarse a travs de las propiedades de la pgina. Estos tres colores diferentes corresponden a los tres estados del vnculo: vnculo normal, vnculo activo
(el ltimo pulsado) o vnculo visitado.
Aqu tienes dos vnculos de ejemplo:
www.google.com

www.ucci.edu.pe

Si has visitado alguno, vers que sale en un tono morado, si no sale en azul.
Recuerda que como todo en nuestra pgina, los vnculos tienen un formato por defecto, pero es totalmente personalizable por CSS. Para ello, basta
con crear una Regla de estilo para la etiqueta a.
Si queremos distinguir entre los tres estados del enlace, emplearemos los siguientes selectores:
a:link para los enlaces normales.
a:visited para los enlaces visitados.
a:active para los enlaces activos.
Aunque recuerda que en las propiedades del documento tenamos la categora Vnculos CSS que nos permite establecer estos valores.
Cuando el vnculo est definido sobre una imagen, en el borde aparecen una serie de puntitos al pulsar sobre ella. Cuando el vnculo est definido
sobre una zona de una imagen (un mapa), aparece el contorno de esa zona.
Aqu tenemos dos vnculos en una imagen:

Como puedes ver, la primera imagen que hace de vnculo contiene un recuadro alrededor. Este es el formato por defecto, pero no suele quedar bien,
sobre todo en imgenes con el fondo transparente.

Adobe Dreamweaver CS6 - Universidad Continental - LMachuca

Pg 31

Programa Adobe Dreamweaver CS6

Sesin de Aprendizaje

Diseo Web

Centro de Educacin Continua

Quitar el marco de una imagen enlace

Veamos como quitarlo utilizando CSS.
En el Inspector de propiedades CSS seleccionamos Nueva regla CSS en Regla de destino, y pulsamos Editar regla.

En Tipo de selector, elegimos Compuesto, y en Nombre de selector escribimos a img, es decir, imgenes que estn dentro de una etiqueta a (de
enlace).
Se abrir la ventana Definicin de regla para a img:

En ella, seleccionamos la categora Borde, y en Style seleccionamos none. Pulsamos Aceptar.

Esta regla har que las imgenes con enlace se muestren sin borde.
Tanto si el vnculo se asigna a un texto como a una imagen, el cursor cambia de forma al situarse encima del vnculo. Suele adquirir la apariencia de
una mano sealando.
Adobe Dreamweaver CS6 - Universidad Continental - LMachuca

Pg 32

Programa Adobe Dreamweaver CS6

Sesin de Aprendizaje

Diseo Web

Centro de Educacin Continua

Enlace a Correo Electrnico

Es posible especificar vnculos a direcciones de correo electrnico. Esto resulta til cuando se desea que los visitantes
de la web puedan contactar con nosotros.
La sintaxis del vnculo en este caso es
mailto:direccindecorreo.
Puede definirse el vnculo a travs de Vnculo, del inspector
de propiedades, seleccionando previamente el texto o la imagen
deseados.
Tambin es posible a travs del men Insertar, opcin
Vnculo de correo electrnico.
En este caso no es posible asignar el vnculo a una imagen, solo permite introducir el texto que contendr el vnculo de correo.
Lo que hace esta opcin es abrir el cliente de correo predeterminado del usuario (Outlook, Firebird...). Por lo que puede no ser prctica si el usuario no
lo tiene, se conecta en un ordenador pblico, o emplea el correo web directamente.
Siempre que se pueda, es mejor crear un formulario de contacto, aunque esto requerir una pgina dinmica como veremos actualmente. Otra
opcin sera mostrar nuestra direccin de correo, para que el usuario pueda enviarnos el correo como quiera. Si publicamos nuestra direccin en la web es mejor
hacerlo como una imagen, o escribindola de forma que la pueda entender un humano (por ejemplo micorreo(arr)sitio.com) para evitar que sea reconocida por
robots que la emplearn para el envo de correo no deseado.

Formatos de imagen para web

Las imgenes pueden ser de muchos formatos diferentes: bmp, gif, jpg, png, tiff, etc. Pero no todos estos formatos son adecuados para una web,
debido a que pueden ocupar mucha memoria o a que no son compatibles con algunos navegadores.
Los formatos ms utilizados para web son el GIF, el PNG y el JPG, que a pesar de ser imgenes de menor calidad que las imgenes BMP, son ms
recomendables debido a que ocupan menos memoria. Vamos a ver un poco ms sobre estos formatos:
Formato GIF:
Utilizan un mximo de 256 colores, y son recomendables para dibujos con grandes reas de un mismo color o de tonos no continuos.
Tambin si se muestra texto.Suelen utilizarse con gran frecuencia, ya que permiten contener transparencias y animacin.En cambio, no estn recomendados
para fotografas, ya que se perderan colores, y al no tener reas de color continuo, el archivo final sera mayor que por ejemplo un JPG.
Formato JPG:
Estas imgenes pueden contener millones de colores, en un archivo comprimido de tamao razonable. Por ejemplo, las imgenes que
obtenemos de una cmara digital suelen estar en este formato. Por tanto, son especialmente indicadas para fotografas, o grficos complejos, obteniendo
mejores resultados que el GIF. En cambio, en grficos con pocos colores y continuos, generar un archivo mayor que el GIF, y podremos apreciar prdida de
calidad.
Formato PNG.
Se trata de un formato de compresin sin perdida. Tiene varias versiones: PNG 8 es un formato de 256 colores muy similar al GIF, que en
teora obtiene archivos algo menores. Tambin admite transparencias. PNG 24 y PNG 36. Es un formato de color verdadero (34 o 36 bits), lo que hace que sea un
archivo de tamao algo mayor. Admite canal de transparencia alfa, lo que quiere decir que puede obtener distintos niveles de transparencia, a diferencia de PNG
8 o GIF que pueden ser totalmente transparentes o no. El resultado es el de mayor calidad, pero tambin de mayor tamao. Este formato es el ms adecuado
cuando necesitamos distintos niveles de transparencia, o requerimos que una imagen muestre correctamente todos sus colores y detalles, evitando la prdida
de calidad que puede producir JPG.
Lo habitual es utilizar GIF o PNG para pequeos grficos, normalmente elementos del diseo o imgenes simples, y JPG para fotografas.
Nos limitaremos al uso de estos formatos. Ya que aunque algunos navegadores soportan otros, no lo hacen todos. Y hemos de asegurarnos de que
cualquier visitante de nuestra pgina pueda ver las imgenes.
Si introduces una imagen no soportada en Dreamweaver, te aparecer un cuadrado gris en su lugar.
Puedes cambiar el formato de las imgenes mediante la utilizacin de algn programa de tratamiento de imgenes, como pueden ser Fireworks,
Photoshop, Corel Draw, o incluso desde el propio Dreamweaver, como veremos en el siguiente avanzado.
Dependiendo del programa utilizado existir una mayor o menor cantidad de opciones a la hora de modificar las imgenes. Para realizar
modificaciones sencillas, como la de recortar las imgenes y cambiar los colores, puedes utilizar incluso el programa Paint de Windows.

Adobe Dreamweaver CS6 - Universidad Continental - LMachuca

Pg 33

Programa Adobe Dreamweaver CS6

Sesin de Aprendizaje

Diseo Web

Centro de Educacin Continua

Insertar Imgenes
En este tema vamos a ver cmo insertar imgenes en un documento. Tambin veremos cmo crear algunas imgenes
especiales, como es el caso de los Rollovers y los botones flash, que ayudan a mejorar la apariencia de nuestras pginas.

Introduccin
Las imgenes son un aspecto muy importante de la web. Ya sea como complementos a la informacin o parte del diseo, la hacen mucho ms
atractiva a ojos del visitante. No obstante, no conviene abusar, ya que aumentarn mucho el tamao final de la web.
Existen una serie de formatos de imagen ms recomendables que otros para ser introducidos en una pgina web. Esta informacin la encuentras en
la hoja anterior a esta.

Insertar una imagen

Para insertar una imagen hay que dirigirse al men Insertar, a la opcin Imagen. Despus de esto, ya es posible seleccionar una imagen a travs de la
nueva ventana. Cuando te acostumbres, te ser ms cmodo acceder con la combinacin de teclas Ctrl + Alt + I.

En Relativa a es posible especificar si la imagen ser relativa al documento o a la carpeta raz del sitio. Es preferible que sea relativa al Documento, ya
que si cambiamos la pgina de carpeta, lo habitual es cambiar tambin sus imgenes.
Lo mismo ocurre cuando se selecciona un documento para crear un vnculo.
La ruta en la que se encuentra la imagen aparecer representada de una u otra forma en el campo URL de la ventana y en el campo Origen del
inspector de propiedades, dependiendo de si ha sido insertada como relativa a la carpeta raz del sitio o relativa al documento.
Por ejemplo, imagina que dentro de la carpeta raz del sitio (la carpeta del sitio) se encuentran la carpeta imagenes y el documento en el que
deseamos insertar la imagen. Dicha imagen, llamada auto.jpg, se encuentra dentro de la carpeta imagenes.
En el caso de insertar la imagen como relativa al Documento la ruta sera:
imagenes/auto.jpg
Mientras que en el caso de ser insertada como relativa a la Raz del sitio la ruta sera:
/imagenes/auto.jpg
Ocurre lo mismo que cuando se crea un hipervnculo a un documento relativo al documento o a la carpeta raz del sitio.
Otra forma de insertar una imagen, es arrastrarla directamente desde el panel Archivos sobre el documento.
Si insertamos una imagen y luego la borramos, la movemos, o escribimos mal su nombre, en Dreamweaver aparecer as indicando que el enlace al
archivo est roto.
En ese caso, la imagen que aparecer en el navegador ser similar a sta:.
Aparece un recuadro blanco con una X roja, junto con el nombre de la imagen o el contenido del campo Alt del inspector de propiedades, que
explicaremos a continuacin.
Adobe Dreamweaver CS6 - Universidad Continental - LMachuca

Pg 34

Programa Adobe Dreamweaver CS6

Sesin de Aprendizaje

Diseo Web

Centro de Educacin Continua

Propiedades de una Imagen

Cuando seleccionamos una imagen el Inspector de propiedades muestra esta apariencia:

Desde aqu podremos establecer distintos atributos a la imagen:

Ancho y Alto son las dimensiones de la imagen. Dreamweaver las pondr directamente.

Como pasaba con el texto, podemos crear un hiperenlace en la imagen escribiendo la direccin en el campo Vnculo, y decidir en qu ventana se
abre con el campo Destino. Podemos hacer que cada zona de la imagen tenga un vnculo distinto, creando un Mapa de imagen.

En el campo Alt escribimos el texto que remplazar a la imagen si sta no puede mostrarse. Es un atributo muy importante que deberamos incluir
siempre para hacer pginas accesibles. Por ejemplo, el texto que se escribe ser ledo por los programas lectores para invidentes. Si lo que
queremos es mostrar un ayuda contextual cuando el usuario tenga el cursor sobre la imagen, debemos de empelar el atributo title. No podemos
insertarlo desde el panel, tenemos que hacerlo desde el cdigo fuente con el formato title="Texto a mostrar". Internet Explorer muestra Alt como
ayuda contextual cuando la imagen no lleva title, pero el resto de navegadores no lo harn, respetando el estndar.

En Clase podrs asignarle un estilo que hayas creado anteriormente, as podrs darle alineacin, bordes e incluso tamao con slo un clic.

Existen otros atributos que afectan al diseo de la imagen. Como ya hemos explicado, la tendencia actual es utilizar CSS para todo lo relativo a diseo,
por lo que estos atributos estn cayendo en desuso y no deberan de ser empleados:

Puedes asignarle un grosor de borde desde el campo Borde.

Puedes seleccionar su alineacin con respecto al texto desde el campo Alinear.

Por ltimo las opciones Espacio V y Espacio H te sern muy tiles para separar la imagen del texto y as no queden demasiado pegadas a l. Estos
campos indican el espacio vertical y horizontal respectivamente entre la imagen y el texto.

Adems, encontramos algunos controles de Edicin: El botn

creando transparencias .
Por otro lado, el icono

nos permite optimizar la imagen desde Dreamweaver, cambiando el formato o

nos permite editar la imagen con un programa externo, como Photoshop o Paint.

Cambiar el tamao de una imagen

Dentro de Dreamweaver puede modificarse el tamao de las imgenes. Por un lado, podemos cambiar el tamao con el que se ve una imagen, pero
dicho cambio de tamao no se aplica directamente sobre el archivo de imagen, que conservar el tamao original.
Es muy probable que la imagen resultante no sea de buena calidad, en comparacin de cmo podra quedar modificndola desde un editor externo,
como Fireworks, Photoshop, etc..
Por ejemplo, vamos a ver lo que ocurre si insertamos una imagen que representa el icono de Dreamweaver y modificamos su tamao de varias formas
diferentes:

Tamao original

Adobe Dreamweaver CS6 - Universidad Continental - LMachuca

Con tamao modificado

Pg 35

Programa Adobe Dreamweaver CS6

Sesin de Aprendizaje

Diseo Web

Centro de Educacin Continua

El resultado puede ser ms o menos satisfactorio, dependiendo del navegador que es el que aplica realmente el re escalado,
pero en ocasiones puede resultar til modificar el tamao de algunas imgenes aunque esto implique perder calidad.
Existen dos formas de modificar el tamao.
Una de ellas es, una vez seleccionada la imagen, arrastrar con el puntero alguno de los recuadros negros que aparecen
alrededor de la imagen.

La otra es a travs de inspector de propiedades, cambiando los campos Ancho o Alto. Estos campos aparecern en el inspector cuando est
seleccionada alguna imagen.
Si estos campos no contienen el tamao original de la imagen, el valor aparecer resaltado en negrita y aparecer a la
derecha una flecha circular que permite volver al tamao original haciendo clic sobre ella.
Como hemos comentado, este cambio de tamao se produce alterando los atributos de anchura y altura, pero no cambiando el tamao real del
archivo, por lo que el usuario deber descargarse el archivo completo con su tamao original.
Por ejemplo, si tenemos una fotografa de nuestra cmara de fotos, de un tamao grande (por ejemplo 2592x1944px), y queremos mostrar una
miniatura (por ejemplo, de 200x150px) esta sera una mala solucin, porque el usuario se estara descargando el archivo completo, y no una miniatura real que
ocupara mucho menos tamao.
Dreamweaver tambin nos permite cambiar el tamao real del archivo de imagen.
Para hacerlo, seleccionamos la imagen, y pulsamos en el icono del Inspector de propiedades.
la imagen. Nos fijamos en la pestaa Archivo.

Se abrir la ventana Presentacin preliminar de

En la seccin escala, podemos establecer un porcentaje del tamao original.

El nuevo tamao se mostrar en An (ancho) y Al (alto). Tambin podemos introducir directamente el nuevo tamao.
Incluso podemos recortar un rea de la imagen, seleccionando Exportar rea, y seleccionando el rea de la imagen en la previsualizacin de la
derecha (no se ve en la imagen anterior).
Cuando lo tengamos, pulsamos Aceptar.
En este caso, si hemos alterado fsicamente el archivo.
El resultado es bastante bueno, aunque siempre ser mejor con herramientas especializadas, como Photoshop o GIMP.
Adobe Dreamweaver CS6 - Universidad Continental - LMachuca

Pg 36

Programa Adobe Dreamweaver CS6

Centro de Educacin Continua

Sesin de Aprendizaje

Diseo Web

Imagen de sustitucin Rollover

Un rollover es una imagen que cambia por otra cuando el puntero se sita sobre ella. Este tipo de imagen suele utilizarse
en los mens o en los botones para desplazarnos a travs de distintas pginas.
Veamos un ejemplo de rollover. Partiendo de las siguientes imgenes

Para insertar un rollover hay que dirigirse al men

Insertar, Objetos de Imagen, a la opcin Imagen de sustitucin. En
la nueva ventana hay que especificar la imagen original y la de
sustitucin.

Es preferible que la opcin Carga previa de imagen de sustitucin est activa. Si se activa, la imagen de sustitucin se carga cuando se carga la
pgina, de este modo se evitan las demoras debidas a la descarga de la imagen cuando llega el momento de que aparezca.
El Texto alternativo es el texto que aparece al situar el puntero sobre una imagen, o el que aparecer en lugar de la imagen en el caso de que por algn
motivo sta no pueda ser mostrada en el navegador.
El texto alternativo puede asignarse a todas las imgenes, no slo a los rollovers. Puede hacerse a travs del campo Alt del inspector de propiedades
de la imagen seleccionada.

Barra de navegacin
Una barra de navegacin es un conjunto de imgenes que se utilizan como opciones de men para navegar dentro de una web. Una pgina web solo
puede contener una nica barra de navegacin.
Para insertar una barra de navegacin hay que dirigirse al men Insertar, Objetos de imagen, a la opcin Barra de navegacin.

Adobe Dreamweaver CS6 - Universidad Continental - LMachuca

Pg 37

Programa Adobe Dreamweaver CS6

Centro de Educacin Continua

Sesin de Aprendizaje

Diseo Web

En la nueva ventana pueden especificarse cuatro imgenes diferentes para cada uno de los botones, el vnculo para
cada uno de ellos, etc.

A travs de los botones superiores de la ventana es posible crear y eliminar botones de la barra de navegacin, as como reordenarlos. Con
crea un botn nuevo, con
se elimina el botn seleccionado, y con
se puede modificar la posicin del botn seleccionado.

se

En Imagen Arriba indicamos la imagen que quieres mostrar inicialmente (cuando todava no se ha hecho clic).
En Sobre imagen, pones la imagen que se mostrar cuando el usuario coloque el cursor sobre el botn y ste estaba mostrando la imagen asignada
en Imagen Arriba.
En Imagen abajo, indicamos la imagen a mostrar despus de que el usuario haya hecho clic en la imagen.
En Sobre mientras imagen abajo, indicamos la imagen a mostrar cuando el usuario mueva el puntero sobre el botn y ste estaba mostrando la
imagen asignada en Imagen Abajo.
De esta forma, si asignas imgenes distintas puedes saber cul es el ltimo botn que ha sido pulsado (el que tiene Imagen Abajo).
Aqu tienes un ejemplo de barra de navegacin. Para su creacin se han utilizado las mismas imgenes para todos los botones, pero como puedes
ver, en el botn del medio aparece inicialmente una imagen diferente de la de los otros dos. Esto se debe a que la opcin Mostrar "Imagen abajo" inicialmente
estaba activa para este botn. Sita el puntero sobre los distintos botones, y pulsa sobre alguno, para ver qu es lo que ocurre.
Observa el campo Texto alternativo (es lo mismo que el campo Alt). Cobra especial importancia en los elementos de navegacin. Si no lo ponemos, el
usuario no podr navegar si la carga de la imagen falla.

El que existan cuatro imgenes diferentes sirve para identificar cual de los vnculos est activo, cosa que con un simple rollover no puede hacerse.
A travs de la opcin Insertar es posible especificar si los botones de la barra de navegacin van a aparecer de forma horizontal o vertical dentro de la
pgina.
Slo podemos tener uno de estos mens por pgina, as que si intentamos insertar uno nuevo, editaremos el existente.
Tanto la imagen de sustitucin como la barra de navegacin se apoyan en JavaScript, una tecnologa que permite cambiar el contenido de la pgina
dinmicamente.
Existe una forma parecida de crear estos efectos utilizando CSS, y de hecho son ms utilizados. Bsicamente consiste en cambiar la imagen de
fondo de un elemento.

Adobe Dreamweaver CS6 - Universidad Continental - LMachuca

Pg 38

Programa Adobe Dreamweaver CS6

Sesin de Aprendizaje

Diseo Web

Centro de Educacin Continua

Las Tablas
En este tema vamos a ver cmo trabajar con tablas. Podremos, entre otras cosas, insertar tablas, combinar celdas,
insertar filas o columnas y cambiar el tamao del borde.

Introduccin
Todos los objetos se alinean por defecto a la izquierda de las pginas web, pero gracias a las tablas es posible distribuir el texto en columnas, colocar
imgenes al lado de un bloque de texto, y otra serie de cosas que sin las tablas seran imposibles de realizar.
La finalidad de las tablas es presentar una serie de datos de forma clara y organizada, dividindolos en filas y columnas.
Hasta hace poco, y todava hoy es fcil encontrar diseos web basados en tablas. Esto es debido a la facilidad que nos ofrecen estos elementos para
organizar contenidos y repartir el espacio. No obstante, esta no es una prctica recomendable, ya que las tablas no fueron pensadas para ello, y si no estn bien
anidadas pueden ocasionar problemas al analizar nuestra web con herramientas automticas, como los bots que indexan el contenido para los buscadores.
Para maquetar nuestras pginas, lo recomendado es emplear capas (div) y CSS.
Las tablas estn formadas por un conjunto de celdas, distribuidas en filas y columnas. A continuacin tienes un ejemplo de tabla.

Insertar una tabla

Para insertar una tabla hay que dirigirse al men Insertar, a la opcin Tabla.
En la nueva ventana habr que especificar el nmero de Filas y Columnas que tendr la tabla, as como el Ancho de la tabla.
El Ancho puede ser definido como Pxeles o como Porcentaje. La
diferencia de uno y otro es que el ancho en Pxeles es siempre el mismo,
independientemente del tamao de la ventana del navegador en la que se
visualice la pgina, en cambio, el ancho en Porcentaje indica el porcentaje de la
pgina o del elmento contenedor) y se ajustar al tamao de la ventana del
navegador, esto permite que los usuarios que tengan pantallas grandes,
aprovechen todo el ancho de pantalla.
Grosor del Borde indica el grosor del borde de la tabla en pxeles, por
defecto se le asigna uno (1). Si lo ponemos a 0 o en blanco, la tabla no mostrar
borde.
Relleno de celda (cellpadding) indica la
distancia entre el contenido de las celdas y los bordes
de stas.
Espacio entre celdas (cellspacing) indica la
distancia entre las celdas de la tabla.
Tambin se puede establecer si se quiere un encabezado para la tabla,
por ejemplo para indicar el contenido de filas o columnas. Aunque podramos
lograr el mismo diseo con celdas normales y estilos CSS, es recomendable
utilizar encabezados en el caso de que los usuarios utilicen lectores de pantalla.
Los lectores de pantalla leen los encabezados de tabla y ayudan a los usuarios de
los mismos a mantener un seguimiento de la informacin de la tabla.
Si queremos incluir un ttulo, lo indicamos en Texto, el ttulo aparecer fuera de la tabla.
En Resumen: podemos indicar una descripcin de la tabla, los lectores de pantalla leen el texto del resumen pero dicho texto no aparece en el
navegador del usuario.
Adobe Dreamweaver CS6 - Universidad Continental - LMachuca

Pg 39

Programa Adobe Dreamweaver CS6

Centro de Educacin Continua

Diseo Web

Sesin de Aprendizaje

Rellenar las celdas

Las celdas son cada uno de los recuadros que forman una tabla, resultan de la interseccin entre una fila y una columna.

Para poder insertar algn elemento en una celda, ya sea texto o imgenes, simplemente hay que situar el punto de insercin dentro de la celda
deseada haciendo clic. El elemento lo insertaremos como hemos visto hasta ahora.
Si queremos insertar elementos ya existentes en la celdas, tenemos que crear primero la tabla vaca, y despus seleccionar y arrastrar los elementos
a insertar sobre la celda. No podemos seleccionar el texto, y crear la tabla "alrededor", como hacamos, por ejemplo, con las listas.

Seleccionar elementos de una tabla

Existen varias formas de seleccionar una tabla. Una de ellas es a travs del men Modificar estando el punto de insercin en la tabla, o desplegando el
men contextual de la tabla al pulsar con el botn derecho sobre ella. En ambos casos aparece la opcin Tabla, a travs de la cual se puede elegir la opcin
Seleccionar tabla.

Tambin es posible seleccionar una pulsando con el ratn sobre el borde exterior que la rodea, o pulsando <table> que aparece en la barra de estado
de la ventana de documento.
Cuando se selecciona una tabla o cuando se coloca el cursor sobre cualquier parte de la tabla, Dreamweaver muestra en una zona verde el ancho de
la tabla y de cada columna. Junto a los anchos se encuentran unos mens desplegables (men de encabezado de la tabla y men de encabezado de la
columna). Estos mens permiten acceder rpidamente a determinados comandos relacionados con la tabla.

Adobe Dreamweaver CS6 - Universidad Continental - LMachuca

Pg 40