 |
17. -Frames
Las frames sirven para dividir la ventana del navegador en diferentes ventanas. De esta forma podemos conseguir que algunas queden fijas y nos muestren siempre sus contenidos (muy útiles para colocar en ellas el menú) y otras nos muestren los contenidos que seleccionemos. Cada ventana contiene un documento HTML. La etiqueta que se utiliza para crear un conjunto de marcos es <frameset> </frameset> e irá a continuación de la etiqueta <head> y antes de la etiqueta <body>. A continuación explicamos cómo crear una web con frames.
Etiqueta <frameset></frameset>
La etiqueta <frameset> indica el modo en que se dividirá la ventana principal. Sus parámetros son: rows (filas) y cols (columnas), dependiendo del tipo de división de la ventana que queramos realizar. Los valores se indicarán en porcentajes, o en valores absolutos, pudiendo utilizar el asterisco ("*") cuando deseemos que sea el navegador el que calcule las dimensiones.
Ejemplos:
| <frameset cols="30%,70%"></frameset> |
Divide la ventana en dos subventanas verticales. La primera (siempre la izquierda) ocupará un 30%, y la otra un 70% |
| <frameset cols="200,*, 400 "></frameset> |
Divide la ventana en tres subventanas verticales. La de la izquierda ocupará 200 pixels, la de la derecha, 400 pixels, quedándole a la del centro el espacio que reste de la pantalla, pues así lo hemos indicaco con el "*" |
| <frameset rows="30%,*"></frameset> |
Divide la ventana en dos subventanas horizontales. La ventana superior ocupará un 30% del espacio. Lo resta, es par la ventana inferior. |
- <frameset rows = "20%, 80% ">
- <frameset cols = "20%, 80%"></frameset> </frameset>
|
Divide la ventana en frames anidadas. El efecto final será: dos filas y dos columnas. |
Etiqueta <frame>
La indica etiqueta <frame> define el contenido de las subventanas establecidas previamente con la etiqueta <frameset>. Es necesario indicar una etiqueta <frame> para cada subventana creada.
Ejemplo:
<frameset cols="30%,70%">
<frame name="frame_izdo" scr="menu.html">
<frame name="frame_dcho" scr="principal.html">
</frameset> |
Se definen dos frames verticales de 30% y 70% respectivamente. Después se da nombre a cada frame y se indica que uno mostrará el documento menú.html y el otro el documento principal.html |
Los parámetros de <frame> son :
- name = Define el nombre de cada frame o subventana.
- src = Define la "URL" o ruta del documento HTML que se mostrará en ese frame.
- frameborder = Indica si existe "borde" que separara esta frame de la siguiente. Los valores son 0 ó 1. Si se indica 0 no se mostrará borde entre las frames.
- marginwidth = Indica el tamaño de los márgenes izquierdo y derecho en pixels.
- marginheight = Indica el tamaño de los márgenes superior e inferior en pixels.
- scrolling = Indica si la subventana tendrá barra de desplazamiento. Los valores son: yes (sí tendrá), no (no tendrá), auto (depende del tamaño del documento).
- noresize Como los frames pueden ser redimensionados por los usuarios en los navegadores, si se indica este parámetro, se imposibilitará la modificación del tamaño de los frames.
Ejemplo:
<frameset cols="30%,70%">
<frame name="frame_izdo" scr="menu.html" frameborder=0 marginwidth =10 marginheight =15 scrolling =auto noresize>
<frame name="frame_dcho" scr="principal.html" marginwidth =10 marginheight =15 scrolling =yes>
</frameset> |
Enlaces en los marcos. Atributo target
La gran ventaja de la utilización de marcos es que una ventana puede aparecer siempre fija en el navegador, mientras que en otra u otras se pueden mostrar diferentes documentos. Es muy corriente colocar en esa ventana fija el menú que nos servirá para navegar por nuestra página. En ella colocaremos los enlaces, pero deberán ir acompañados del atributo target para definir cuáles serán las subventanas de destino, es decir, las que mostrarán los documentos.
Ejemplo:
<A href= "clientes.html" target = "frame_dcho">
En el ejemplo, el documento "clientes.html", abrirá en el frame que previamente hemos llamado "frame_dcho" dentro de los valores de frame (ver ejemplos anteriores).
Si se prefiere, en vez de indicar el nombre de un frame como destino de nuestro enlace, podremos utilizar los siguientes parámetros:
-
self: El destino es la propia ventana que contiene el enlace. Es el valor por defecto.
-
top: Identifica al documento en el que hemos establecido la estructura de los frames. Suprime todas las subventanas de la ventana principal y muestra el destino a pantalla completa.
-
parent: Se refiere al frame inmediatamente superior. En caso de existir un único nivel de frames, top y parent coinciden.
-
blank: Abre una nueva copia del navegador y muestra el documento de destino en ella.
Etiqueta <noframe></noframe>
Hay navegadores que no soportan los frames. Para tratar esta situación se utiliza la etiqueta <noframe></noframe>. Toda la información que incluyamos dentro de ella será la que visualicen estos navegadores. Esta etiqueta se coloca dentro de la etiqueta <frameset></frameset>
Ejemplo:
<frameset cols="30%,70%">
<frame name="frame_izdo" scr="menu.html">
<frame name="frame_dcho" scr="principal.html">
<noframe>Parece que su navegador no soporta los marcos. Pulse el siguiente enlace para accedera a una versión sin marcos<a href=menú.html>menú</a> </noframe>
</frameset> |
|
|
| |
|
|
Crea tu web Tutorial HTML Trucos HTML Trucos Dreamweaver