Scribd
Cargar
25 vistas4 páginas

HTML Frames

El documento explica cómo crear páginas web utilizando frames en HTML, permitiendo dividir la pantalla en áreas independientes con contenido diferente. Se presentan ejemplos de código para implementar marcos horizontales y verticales, así como la gestión de enlaces entre ellos. Además, se incluyen ejemplos prácticos de archivos HTML que componen una estructura de página con frames.

Cargado por

johanebc271203
Derechos de autor
© © All Rights Reserved
Nos tomamos en serio los derechos de los contenidos. Si sospechas que se trata de tu contenido, reclámalo aquí.
Formatos disponibles
Descarga como PDF, TXT o lee en línea desde Scribd
25 vistas4 páginas

HTML Frames

El documento explica cómo crear páginas web utilizando frames en HTML, permitiendo dividir la pantalla en áreas independientes con contenido diferente. Se presentan ejemplos de código para implementar marcos horizontales y verticales, así como la gestión de enlaces entre ellos. Además, se incluyen ejemplos prácticos de archivos HTML que componen una estructura de página con frames.

Cargado por

johanebc271203
Derechos de autor
© © All Rights Reserved
Nos tomamos en serio los derechos de los contenidos. Si sospechas que se trata de tu contenido, reclámalo aquí.
Formatos disponibles
Descarga como PDF, TXT o lee en línea desde Scribd
Está en la página 1/ 4

HTML- Frame

Electiva I: HTML

FRAMES
Los frames (en inglés frame = cuadro, bastidor o marco) es un elemento implementado por
Netscape, que permite dividir la pantalla en varias áreas independientes unas de otras, y por
tanto con contenidos distintos, aunque puedan estar relacionados.
En los siguientes ejemplos desarrollados se podrá diseñar una página con diferentes frames,
y posteriormente se le añadirán enlaces...
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. Entonces, antes que 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, 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.
MARCO VERTICAL
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">
Profa. Daira Montaño ELECTIVA I Página 1
HTML- Frame

<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.

EJEMPLO 1.
Para el index.html
<frameset rows="100,*">
<frame name="alto" src="top.html">
<frameset cols="150,*">
<frame name="sx" src="menu.html">
<frame name="central" src="central.html">
</frameset>
</frameset>

Para el menu.html
<html>
<body>
<BODY BGCOLOR="blue">
<h1>MENU</h1>
</body>
</html>

Para el central.html
<html>
<body>
<BODY BGCOLOR="yellow">
CONTENIDO DE LA PAGINA
</body>
</html>

Finalmente el top.html
<html>
<head>
<title>top de banner</title>

Profa. Daira Montaño ELECTIVA I Página 2


HTML- Frame

</head>
<body>
<BODY BGCOLOR="blue">
TITULO O BANNER DE TOP
</body>
</html>

EJEMPLO 2: Ejemplo para los hiperenlaces locales en diferentes frames


1- crear una página html llamada index.html
<frameset rows="100,*">
<frame name="alto" src="top.html">
<frameset cols="150,*">
<frame name="sx" src="menu.html">
<frame name="central" src="central.html">
</frameset>
</frameset>

2- crear una página html central.html


<html>
<body>
<BODY BGCOLOR="yellow">
CONTENIDO DE LA PAGINA
</body>
</html>

3 crear una página floklore.html


<head>
<title>Documento sin título</title>
</head>
<body>
<p>Material de contenido</p>
<p>&nbsp;</p>
</body>
</html>

4 crear una página menu.html


<html>
Profa. Daira Montaño ELECTIVA I Página 3
HTML- Frame

<body>
<BODY BGCOLOR="blue">
<h1>MENU</h1>
<p><a href="musica.html" target="central">MUSICA</a></p>
<p><a href="floklore.html" target="central">FOLKLORE</a></p>
<p>HTML</p>
</body>
</html>

5 crear una pagina musica.hml


<head>
</head>
<body>
<p>Musica</p>
<p>Notas incluidas ritmicamente...</p>
<form name="form1" method="post" action="">
imagen de prueba
<input type="image" name="im01" id="im01" src="imagenes/$_1.JPG">
</form>
<p>&nbsp;</p>
<p>&nbsp;</p>
</body>
</html>

6 Crear una página top.html


<html>
<head>
<title>top de banner</title>
</head>
<body>
<BODY BGCOLOR="red">
TITULO O BANNER DE TOP
</body>
</html>
Con el ejemplo anterior podrán crear una página con diferentes frames que se desplegaran en
la página central....

Profa. Daira Montaño ELECTIVA I Página 4

También podría gustarte