Realización de Páginas con Frames o Marcos
Los marcos son instrumentos que forman ya
parte habitual del web y que los navegadores gestionan hoy día a la
perfección. Los detractores de los marcos afirman la inutilidad de
subdividir ulteriormente las páginas web, las cuales, en última
instancia, pueden resultar poco legibles. Otros, como yo, consideran que
los marcos pueden llegar a ser muy útiles ya que se evita cargar las
mismas imágenes y se mantienen ordenados el contenido estructura
del sitio.
Para crear una página dividida en marcos, es
necesario crear varios archivos HTML referidos a un archivo principal,
que es el que permite su gestión. Así pues, antes de nada hace falta
impostar este archivo "fuente", y, posteriormente, los demás archivos
que componen el marco.
Imaginemos
que debemos crear una ventana dividida en marcos como la de la figura,
con un marco en la parte superior fijo (en el cual cargaremos el archivo
"top.htm", que deberemos crear aparte) y un marco central (en el cual
cargaremos el archivo "central.htm", que deberemos, asimismo, crear
aparte) que cambiará según cual sea la página que deba mostrar. Como
hemos señalado antes, la gestión de estos dos marcos correrá a cargo de
un tercer archivo, el cual deberá invocarlos asignándoles una parte de
la página. He aquí el código de esta página:
<FRAMESET rows="80,*">
<frame name="alto" src="top.htm">
<frame name="central" src="central.htm">
</FRAMESET>
Como podemos ver, el código del marco está encerrado entre las marcas
<FRAMESET></FRAMESET> que se comportan como las marcas
usuales <HTML></HTML>.
El tamaño de los marcos, o mejor dicho, el espacio que cada uno de ellos
debe ocupar en la página, queda establecido mediante la marca rows="80,*,
que significa que el marco alto (que en este caso es una fila, "row")
debe tener 80 píxel, mientras que "*" significa que todo el resto debe
asignarse al marco central. Asimismo, habríamos podido expresar el
tamaño de los marcos en tantos por ciento de esta manera:
<FRAMESET rows="20%,*">
Una vez impostados los dos parámetros <FRAMESET></FRAMESET>,
dentro de ellos se definen los nombres y los archivos que deberán
invocarse en los dos marcos creados. Es necesario dar un nombre al marco
(name="alto") e indicar el archivo HTML que deberá cargarse dentro del
marco (SRC="top.htm"). Deben, por tanto, crearse previamente dos
archivos de nombre "top.htm" y "central.htm".
Fíjate bien en lo importante que es la colocación dentro del código para
una correcta interpretación por parte del navegador. Así, si se
invirtiera el orden de esta manera:
<FRAMESET rows="80,*">
<frame name="central" src="central.htm">
<frame name="alto" src="top.htm">
</FRAMESET>
el navegador invertiría el orden de asignación y cargaría el archivo
"central.htm" en el marco superior, y el archivo "top.htm" en el marco
central.
Para crear dos marcos verticales basta sustituir el término "rows" (filas) con el término "cols" (columnas):
<FRAMESET cols="100,*">
<frame name="sx" src="sx.htm">
<frame name="central" src="central.htm">
</FRAMESET>
Es posible adoptar simultáneamente una división tanto en columnas como
en filas, de manera que se cree una ventana dividida en varios marcos.
Veamos cómo debemos intervenir en el código HTML del documento según el
número y la posición de los marcos que queremos crear.
. |
<frameset rows="100,*">
<frame name="alto" src="top.htm">
<frameset cols="150,*">
<frame name="sx" src="sx.htm.htm">
|
<frame name="central" src="central.htm">
</frameset>
|
 |
<frameset cols="120,*">
<frame name="sx" src="sx.htm">
<frameset rows="100,*">
<frame name="alto" src="top.htm">
|
<frame name="central" src="central.htm">
</frameset>
|
 |
<frameset cols="120,*">
<frame name="sx" src="sx.htm">
<frameset rows="20%,60%,20%,*">
<frame name="alto" src="top.htm">
|
<frame name="central" src="central.htm">
|
<frame name="bajo" src="basso.htm">
</frameset>
|
 |
<frameset cols="75%,25%">
|
<frameset rows="20%,80%*">
<frame name="alto" src="top.htm">
|
<frame name="central" src="central.htm">
</frameset>
<frame name="dx" src="dx.htm">
</frameset>
|
 |
<frameset cols="75%,25%">
|
<frameset rows="20%,80%*">
<frame name="alto" src="top.htm">
<frameset cols="20%,80%*">
<frame name="sx" src="sx.htm">
|
<frame name="central" src="central.htm">
</frameset>
</frameset>
<frame name="dx" src="dx.htm">
</frameset>
|
 |
<frameset cols="75%,25%">
|
<frameset rows="20%,80%*">
<frame name="alto" src="top.htm">
|
<frame name="central" src="central.htm">
</frameset>
<frameset rows="24%,76%">
<frame name="top" src="top2.htm">
<frame name="dx" src="dx.htm">
</frameset>
</frameset>
|
 |
<frameset cols="25%,75%">
|
<frameset rows="80%,20%">
<frame name="alto" src="top.htm">
|
<frame name="bajo" src="basso.htm">
</frameset>
<frame name="central" src="central.htm">
</frameset>
|
 |
<frameset rows="20%,60%,20%">
<frame name="alto" src="top.htm">
|
<frame name="central" src="central.htm">
|
<frame name="bajo" src="basso.htm">
</frameset>
|
 |
<frameset cols="20%,60%,20%">
<frame name="sx" src="sx.htm">
|
<frame name="central" src="central.htm">
|
<frame name="dx" src="dx.htm">
</frameset> | | | | | | | | | |
ENLACES:
Bibliografia:
http://www.desarrolloweb.com/articulos/1222.php
http://www.htmlpoint.com/guida/html_13.htm
