CURSO COMPLETO DE DREAMWEAVER 8

--MEDIOS--



01 - MARCOS

Un conjunto de marcos, contiene información sobre la cantidad de marcos que habrá en la página, el tamaño, etc. Este conjunto, solo muestra la informacion, para mostrar los marcos.

Un marco una zona o área de una página HTML, cada marco aloja una página web, que puede ser trabajada de forma independiente.

Os pongo un ejemplo para que lo veais más claro:


Aquí vemos una página dividida en 3 marcos, es decir, 4 páginas HTML independientes.

Untitled document: És la página que contiene los 3 marcos.

Marco superior: Suele usarse, para poner el logo, cabeceras, etc...

Marco lateral: Sulen usarse, para insertar los botónes de menú, etc...

Marco central: Contiene el contenido o destino del marco lateral, etc...

Para crear marcos, lo podemos hacer de dos formas distintas, pero primero vamos a hacer que sus bordes sean visibles, eso nos facilitará la localización de los mismos, y trabajaremos mejor, para ello nos vamos a Ver > Ayudas visuales > Bordes de marco



* Arrastrando desde los bordes superior o izquierdo (justo en el borde donde terminan las reglas) hacia el centro del documento.



* Desde el panel de insertar > Diseño (Si no lo tenemos visible, lo hacemos desde Ventana > Insertar )



Es muy sencillo, tan solo en el desplegable, elegimos o bien uno de los conjuntos de marcos prediseñados, o bien los vamos elegiendo uno a uno según queramos que formen nuestra página, si nos equivocamos o queremos eliminar algún marco de nuestra página tan solo debemos arrastrarlo hacia el borde del mismo.



Vamos a crear una página con marcos, para verlo de forma práctica y trabajarlos juntos.


Abrimos un nuevo documento de HTML.

Y creamos los marcos, tal y como se vé en la siguiente captura:



Ahora nos aseguramos de que la paleta de marcos está activada, para ello nos vamos a Ventana > Marcos



Activamos el Marco superior, en la paleta de marcos y ponemos nuestra imagen de logo y centramos, le damos a la página el color de fondo #7BAB2D

Ahora activamos el Marco central, y ponemos nuestra imagen "Index" incluida en el material, también le damos color de fondo #7BAB2D

Ahora vamos a activar el marco lateral, le damos a la página color de fondo #7BAB2D

Creamos una tabla:



Ahora vamos a configurar las celdas con dos colores #568000 y el color #669900 alternativamente en las celdas de nuestra tabla, a la cabecera le damos el color #496C00

Ahora solo tenemos que darle los valores que nos interese, y adaptarla a nuestro marco.

Ahora activamos el marco inferior, le damos color de fondo a la página #7BAB2D e introducimos el banner del foro enlazado, y pondremos los créditos de cada cual.


Esta página está basada en un tutorial del Foro Design Sensation, todos los derechos reservados.
Maquetado por Tu nombre/Tu web (si tienes)

Podemos modificar algunas propiedades de los marcos desde la paleta propiedades, por ejemplo podemos darle un borde y un color al mismo, darle una anchura y altura determinados, una cosa muy interesante es poder eligir si vamos a poner o no barra de desplazamiento.

Ahora vamos a guardar nuestra página y los marcos que la componen, podemos hacerlo uno a uno Guardar marco como o podemos guardar todo el conjunto de marcos para eso seleccionamos todo el conjunto de marcos desde la paleta de marcos y hacemosGuardar conjunto de marcos como le damos un nombre, ya sabeis que si va a ser la página principal de vuestra página web, debe llamarse index.

Para que nuestras páginas se vean en el marco central, tenemos que redireccionarlas al mismo, para ello, a la hora de enlazar, ahora aparecen varias opciones más con los nombres de nuestros marcos, en el destino que podemos darle, en este caso, para que nos salgan en la ventana central, elegiremos como destino mainFrame

Nuestra página debería quedar así:



2007©By Almaweb.es

subir

Ir al menú de tutoriales de DREAMWEAVER

Todos los tutoriales son de mi completa autoría,

cualquier parecido con otros, es pura coincidencia.

Queda totalmente prohibida su reproduccion, total o parcial.

Si quieres enlazar mis tutoriales, no hay problema,

solo mandame un e-mail, para comunicarmelo.

Cualquier duda o sugerencia:

Tutoriales registrados

 

Alma Web

Design Sensation by almaweb.es

Foro Design Sensation