CURSO COMPLETO DE DREAMWEAVER 8

--MEDIOS--



02 - TRABAJANDO CON LOS MARCOS



Vamos a ver distintas formas de trabajar con marcos, la manera de insertar páginas ya confeccionadas dentro de unos marcos especificos.

Primero vamos a abrir un nuevo documento de HTML, y creamos los marcos necesarios para que nos quede así:



Ahora vamos a insertar en cada uno de nuestros marcos, la página correspondiente al mismo, para ello nos vamos a Archivo > Abrir en marco



Vamos a seguir un orden, el primero que vamos a vincular, es la cabecera, para ello, nos vamos a la ventan de marcos y seleccionamos la cabecera (topframe), ahora nos vamos a Archivo > Abrir en marco



Seleccionamos el archivo LogoCabecera.html de la carpeta de material que te hemos proporcionado al principio del tutorial.

Ahora vamos a desplazar el marco hacia abajo, para que así quede bien colocadito nuestro logo, para ello aunque podemos hacerlo arrastrandolo hacia abajo, nosotros lo vamos a hacer de forma más precisa, usando la ventana de propiedades:



Tan solo tenemos que modificar el valor de la fila en si, como queremos un valor fijo, ese valor se lo vamos a dar en pixeles, ya que si lo hicieramos con porcentaje o relativo, lo configurariamos de tal forma que iria en relación al tamaño de la página web o al documento. Le vamos a dar un valor de 200 pixels.



Ahora vamos a fijarnos que en las propiedades de nuestro marco, sale configurado que no llevará barra de desplazamiento, por defecto debería venir que no, pero no está de más asegurarse, tambien podemos echar un vistazo al resto de propiedades.

Ahora nos vamos al marco lateral izquierdo (leftFrame) y abrimos el archivo Menu.html, tal y como hemos explicado con anterioridad, esta vez le vamos a dar un valor de 250 pixeles a la fila de nuestro marco. Tambien nos aseguramos de que este marco no tenga barra de desplazamiento ni bordes.



Abrimos ahora el lateral derecho (rightFrame), abrimos el archivo Logolateral.html, y esta vez si que vamos a darle un valor a la fila de nuestro marco relativo, configuramos así:




Y ahora arrastramos hacia el centro el borde de nuestro marco, hasta que tome el aspecto que nosotros deseamos, más o menos debería quedarnos así:



Abrimos ahora el archivo Creditos.html en el marco inferior(bottonframe), y configuramos la fila de nuestro marco, con 175 pixels.

Ahora vamos a abrir el archivo Inicio.html en el marco interior (mainFrame), este marco, suele venir predefinido con barra de desplazamiento, por lo que si nosotros no quisieramos que tubiese tendriamos que cambiarlo, en nuestro caso lo vamos a dejar así, con su barra de desplazamiento, y por norma general lo haremos siempre así, porque es en la página donde irá, probablemente el contenido de nuestar web y por tanto será necesaria una barra de desplazamiento para poder mostrarlo al completo.

El resto de la página ya está configurada, los botones estan ya enlazados correctamente y he adjuntado una hoja de estilos a nuestra web, que facilita el trabajo a la hora de modificaciones posteriores en la página, pero esto lo veremos más adelante bien a fondo.



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