Tres Frames

24/Mar/2007 HTML 10 Comentarios

La idea de este ejemplo es ver cómo montar una página que contenga tres frames.

La disposición de la página será la siguiente: en el lado izquierdo tendremos un frame de ancho 20% del total, en el lado derecho tendremos dos frames en disposición horizontal. El superior ocupará el 90% del espacio, mientras que el inferior ocupará el 10% restante.

Quedándonos la siguiente disposición:

Frame
de la Izquierda

Frame Superior

Frame
Inferior

Lo primero que tenemos que hacer es definir la página que va a contener la división de los frames y posteriormente cada una de las tres páginas que son el contenido de los respectivos frames.

La página que define el frame utilizará la etiqueta FRAMESET para definir la división. Para definir las divisiones hay que ir de la más general a la más concreta. A si que en nuestro caso la primera división es en columnas y la segunda es en filas, para la columna de la derecha.

A si que la primera división se definiría con el atributo cols de la siguiente forma

  1. <frameset cols="20%,*"></frameset>

Como puedes ver, cuando queremos indicar que el tamaño de un frame es el resto, utilizamos el comodín *.

Una vez definida la división hay que indicarle el contenido de los dos primeros frames. Para el primero, como ya es un contenido fijo utilizaremos la etiqueta FRAME, la cual, mediante el parámetro src indica el contenido de la misma de la siguiente forma:

  1. <frame src="izquierda.htm" name="izquierda"/>

Es bueno que utilicemos el atributo name para luego poder redirecionar los enlaces a uno u otro frame.

En el caso del segundo frame, como no es un contenido fijo, sino que es otra división, tendremos que utilizar nuevamente la etiqueta FRAMESET. Pero en este caso, con una división en filas:

  1. <frameset rows="*,10%"></frameset>

Como nota final cabe indicar que todavía nos podemos encontrar navegadores que no entiendan de frames (ya es raro, antes era algo más habitual). A si que, para estos casos, es bueno utilizar la etiqueta NOFRAMES con un contenido de texto avisando de que su navegador no soporta frames.

  1. Su navegador no soporta frames
  2. </body>
  3. </noframes>

Vídeos sobre HTML


10 comentarios en “Tres Frames”

Víctor Cuervo

Randex-G

tengo el mismo modelo de página web, mi duda es la siguiente, hay alguna forma de fijar el frame “de la izquierda”, me explico,
cierto que está dividida la página en 3, entonces, cuando yo tomo la ventana del borde y empiezo a redimensionar, “EL FRAME DE LA IZQUIERDA”, se redimensiona solo, habrá alguna forma que, cuando yo haga eso, el FRAME quede ahí mismo ?, ojalá se haya entendido, Saludos de Santiago de Chile Randex-G

Víctor Cuervo

Víctor Cuervo

@alex,

Cuando llames al iframe puedes pasarle parámetros. Por ejemplo:

Espero que te sirva.

Saludos.

Víctor Cuervo

alex

como puedo enviar datos a 3 iframes o mas con html sin javascript o es necesario

Víctor Cuervo

chuchit0o

¿Cuanto tardan en responder un mensaje?

Víctor Cuervo

lineadecodigo

@kimi,

El asterisco (*) significa “el resto”. Es decir, al poner:
<FRAMESET ROWS=”*,10%”></FRAMESET>

Es lo mismo que si pusiésemos:
<FRAMESET ROWS=”90%,10%”></FRAMESET>

Digamos que nos permite cierta comodidad a la hora de codificar.

Víctor Cuervo

apg

Hola, hablando de frames, he seguido el artículo y ahora se me presenta el siguiente interrogante:
¿Puedo actualizar dos frames al pulsar sobre un enlace alojado en uno de ellos?

Víctor Cuervo

Kmi

q hay que poner en el *?

Víctor Cuervo

lineadecodigo

Hola Jessica,

El código lo tienes en el enlace “Descargar el código” de la parte de abajo del artículo.

¿Es esto lo que buscabas?

Víctor Cuervo

JESSICA JULIETH DELGADO POVEDA

deberian poner el codigo en si todo para una mejor atencion al usuario

¿Algo que nos quieras comentar?

Déjanos tu comentario, no te preocupes que tu email no será publicado

*

*