220/03/04 |
|
Ángel
R. Puente Pérez |
16.1.- Estructura de marcos con tres frames.
Supongamos que queremos construir una página con tres
marcos diferentes:
-
Un marco horizontal superior que ocupe todo el espacio a lo
ancho, donde puede ir el título del sitio, un logotipo,...
-
El resto del espacio divido en dos espacios verticales:
- El de la izquierda donde habrá un menú de
enlaces.
- El más grande de la derecha donde se cargarán
los enlaces pulsados en la izquierda.
La sintaxis va a consistir en dos frameset
anidados, el primero que definirá las dos filas (la superior y
el resto del espacio). El segundo que dividirá ese resto del espacio
entre las dos columnas.
Código del primer frameset:
<html>
<head>
<title>Las dos filas</title>
</head>
<frameset rows="15%,*">
<frame src="titulo.html">
<frame src="resto_espacio">
</frameset>
</html> |
Como el segundo frame en realidad son dos, sustituimos su definición
por el código del segundo frameset:
<frameset cols="20%,*">
<frame src="indice.html">
<frame src="saludo.html" name="principal">
</frameset>
|
El código quedaría así:
<html>
<head>
<title>Fila superior y dos columnas</title>
</head>
<frameset rows="15%,*">
<frame src="titulo.html">
<frameset cols="20%,*">
<frame src="indice.html">
<frame src="saludo.html" name="principal">
</frameset>
</frameset>
</html> |
Veamos los códigos de todos los archivos:
Primero el documento titulo
que se cargará en el marco superior:
<html>
<head>
<title>Marco superior</title>
</head>
<body bgcolor="#0066cc">
<font color="#ffffff">
<center>
<h1>mi sitio web</h1>
</center>
</font>
</body>
</html> |
Lo guardamos como titulo.html
Veamos el documento indice
que se cargará en la columna izquierda:
<html>
<head>
<title>Marco de la izquierda con enlace</title>
</head>
<body bgcolor="#dfdfdf">
<a href="enlace.html" target="principal">
enlace
</body>
</html> |
Lo guardamos como indice.html
El documento saludo que se
carga inicialmente en el marco principal:
<html>
<head>
<title>Marco de la derecha</title>
</head>
<body bgcolor="#ff9999">
<center>
<h1>
Bienvenido a mi página web
</h1>
</center>
</body>
</html> |
Lo guardamos como saludo.html
Falta el documento enlace
que se cargará en el marco principal al ser pulsado el enlace:
<html>
<head>
<title>Documento a cargar en principal</title>
</head>
<body bgcolor="#ffcccc">
<center>
<h2>
Has pulsado el enlace correctamente
</h2>
</center>
</body>
</html> |
Lo guardamos como enlace.html
El documento de la estructura de marcos es el inicial. Lo guardamos
como index.html:
<html> <head> <title>Fila superior y dos columnas</title> </head> <frameset rows="15%,*"> <frame src="titulo.html"> <frameset cols="20%,*"> <frame src="indice.html"> <frame src="saludo.html" name="principal"> </frameset> </frameset> </html>
|
220/03/04 |
|
Ángel
R. Puente Pérez |
|