Los frames o cuadros son divisiones que se le pueden dar a una página Web. En cada uno de los frames se pueden cargar una página diferente que actúan independientemente una de otra.
El uso más común del empleo de los frames es en la aplicación de menús.
En el cual se divide la pantalla en dos frames, uno estrecho (en la parte superior o al lado izquierdo) y otro mayor. Dentro del frame estrecho, se carga la pagina con un menú conteniendo los enlaces a otras paginas, al pulsar uno de estos enlaces, se carga la pagina dentro del frame. Mayor.
De manera que el menú siempre estará visible en la parte superior o izquierda, y los contenidos se estarán cambiando dentro del frame principal.
Ejemplo: Menú Horizontal
Ejemplo: Menú Vertical
Para crear frames se utilizan las directivas cerradas <FRAMESET>..... </FRAMESET>
Esta directiva indica inicio y final de los frames o cuadros.Dentro de ella se colocan todos los frames que se van a emplear.
La directiva FRAMSET se coloca en lugar de BODY.
Se coloca una directiva <FRAME> por cada cuadro que se quiera tener.
La directiva <FRAME> indica el archivo que va a contener ese cuadro o frame.
Ejemplo: <FRAME SRC="archivo.html">
La directiva FRAMESET, nesesita los parametros ROWS ó COLS, que indican si la pantalla se va a dividir en filas o columnas.
Ejemplos:
Crear dos marcos o frames horizontales
<html>
<head>
<title>Frame 1</title>
</head>
<frameset ROWS="50%,50%">
<frame src="reglaoro.html">
<frame src="bienpormal.html">
</frameset>
</html>
Crear dos marcos o frames Verticales
<html>
<head>
<title>Frame 2</title>
</head>
<frameset COLS="50%,50%">
<frame src="reglaoro.html">
<frame src="bienpormal.html">
</frameset>
</html>
Crear dos marcos o frames Horizontales de 20 % la primera columna y 80% la segunda columna.
<html>
<head>
<title>frame 3</title>
</head>
<frameset rows="20%,80%">
<frame src="banner1.htm">
<frame src="inmortalidad.html ">
</frameset>
</html>
Crear dos marcos o frames Verticales de 20 % la primera columna y 80% la segunda
<html>
<head>
<title>Frame 4</title>
</head>
<frameset cols="20%,80%">
<frame src="reglaoro.html">
<frame src="bienpormal.html">
</frameset>
</html>
Crear dos marcos o frames horizontales fijando el tamaño por medio de pixels
En el siguiente ejemplo se da un tamaño de 100 pixels al frame superior y el resto de la altura para el área inferior.
<html>
<head>
<title>frame 5</title>
</head>
<frameset ROWS="100,400">
<frame src="banner1.htm">
<frame src="inmortalidad.html">
</frameset>
</html>
Frames o cuadros iteractivos
Para que puedas controlar y decidir en que frame se carga una mueva página es nesesario dar un nombre al FRAME, y referir a el, la pagina a cargar.
El atributo NAME, es el que permite darle un nombre a cada frame, el cual es referido por el atributo TARGET="nombre del frame". El atributo TARGET, se coloca dentro de un enlace, el cual al ser activado el enlace carge la página en el otro frame referido por TARGET en lugar de cargarlo en el propio frame.
Ejemplos:
Frames o cuadros verticales iteractivos
Para crear frames iteractivos, es nesesario nombrar el frame con el attributo NAME.
Este atributo se coloca dentro del frame.
<frameset cols="20%,80%">
<frame src="menu2-v.html">
<frame src="reglaoro.html" NAME="principal">
</frameset>
Notese que el segundo frame se llama principal.
Para que funcione el frame iteractivo es nesesario que los enlaces esten relacionados con el frame, por medio del atributo TARGET, el cual se coloca dentro de los enlaces.
Para que funcione el programa frame 6 es nesesario que el programa menu2-v.html, contenga el atributo TARGET encada uno de los enlaces. A continuación damos la codificación de dicho programa.
Extracto del archivomenu2-v.html
<a HREF="reglaoro.html" TARGET="principal">La regla de oro</a>
<a HREF="unidad.html" TARGET="principal">La unidad de la religión</a>
<a HREF="cosecha.html" TARGET="principal">La cosecha de los hechos</a>
<a HREF="lavenida.html" TARGET="principal">La venida de los profetas</a>
Notese que cada enlace se le agrego el atributo TARGET="principal", este atriibuto le indica al browser que la pagina enlazada se debe de cargar en el frame principal, y no en el frame desde el que se esta activando.
También se puede utilizar división horizontal de frames iteractivos
UILIZANDO BASE TARGET
Otro método para relacionar varios enlaces con un frame, es utilizando BASE TARGET, con esta directiva, nos ahorramos el tener que especificar TARGET en cada uno de los enlaces, y en su lugar solo basta con especificar una sola vez al principio de BODY el atributo <BASE TARGET>. para ilustrar esto a continuación le presentamos el siguiente ejemplo:
Extracto del archivomenu3-v.html
<BASE TARGET="principal">
<a HREF="reglaoro.html">La regla de oro</a>
<a HREF="unidad.html">La unidad de la religión</a>
<a HREF="cosecha.html">La cosecha de los hechos</a>
Compare la codificación del programa menu2-v.html con menu3-v.html, y notese que nos ahorramos escribir TARGET en cada enlace, al especificar BASE TARGET al inicio.
El programa anterior (menu3-v.html) nesesita el programa frame7.html
Directiva NOFRAMES
Esta se utiliza para advertir a los visitantes que no cuenten con un browser actualizado, ya que los browsers viejos no manejan frames.
Dentro de la sección NOFRAMES, se coloca un mensaje advirtiendo al visitante que nesesita un browser actualizado para poder ver la pagina con frames, o para dar un enlace a una versión sin frames.
<frameset cols="20%,80%">
<frame src="menu3-v.html">
<frame src="reglaoro.html" NAME="principal">
</frameset>
<NOFRAMES>
<body>
Esta página utiliza frames, pero su browser no los maneja.
</body>
</NOFRAMES>
</html>
|
1. HTML para principiantes HTML para principiantes , aprende a hacer tus propias páginas web. Programar en un... [15/09/09] |
9.836 | ||||
|
2. HTML. Cómo crear imagen Sigue este tutorial de informática y aprende a crear banners con links en tu... [31/03/11] |
985 |
|
|||
|
3. HTML, CSS. Menú horizontal Aprende a utilizar los elementos básicos de HTML y CSS , y crea un menú sencillo... [12/04/11] |
436 |
|
|||