1. 1 Prólogo al manual de HTML
2. 2 Introducción al HTML
3. 3 Sintaxis del HTML
4. 4 Tu primera pagina
5. 5 Formato de parrafos en HTML
6. 6 Formateando el texto
7. 7 Color, tamaño y tipo de letra
8. 8 Atributos para paginas
9. 9 Listas I
10. 10 Listas II
11. 11 Listas III
12. 12 Caracteres especiales
13. 13 Enlaces internos
14. 14 Enlaces en HTML
15. 15 Enlaces locales
16. 16 Enlaces externos, de correo y hacia archivos
17. 17 Imagenes en HTML
18. 18 Alineación de imagenes con HTML
19. 19 Formatos graficos para paginas web
20. 20 Tablas en HTML
21. 21 Tablas en HTML. Atributos para filas y celdas
22. 22 Tablas en HTML. Atributos de la tabla y conclusión
23. 23 Formularios HTML
24. 24 Elementos de Formularios. Campos de texto
25. 25 Otros elementos de formulario
26. 26 Envio, borrado y demas en formularios HTML
27. 27 Mapas de imagenes con HTML
28. 28 Frames en HTML
29. 29 Frames - Explicación basica
30. 30 Frames - Creación de una estructura simple
31. 31 Frames - Una pagina en cada marco
32. 32 Frames - Dirigir los enlaces
33. 33 Frames - Anidar frames
34. 34 Frames - Atributos avanzados
35. 35 Ventajas e inconvenientes del uso de frames
36. 36 Las nuevas etiquetas de HTML 4.0
37. 37 Las nuevas etiquetas de HTML 4. 0 (1)
38. 38 Las nuevas etiquetas de HTML 4. 0 (2)
39. 39 Sonido en HTML I, introducción
40. 40 Sonido en HTML II, características del sonido digital
41. 41 Sonido en HTML (III)
42. 42 Sonido en HTML (IV)
43. 43 Sonido en HTML (V)
44. 44 Frames

33 - Frames - Anidar frames

Tutorial creado por Indaya.com. Extraido de: http://www.indaya.com

11 de Septiembre de 2005

Para crear estructuras de marcos en las que se mezclen las filas y las
columnas debemos anidar etiquetas <FRAMESET>. Empezando por la partición de
frames más general, debemos colocar dentro las particiones de frames más
pequeñas. La manera de indicar esto se puede ver fácilmente con un ejemplo. 
 

Los pasos para definir la anidación se pueden encontrar
a la derecha.

Los distintos frames vienen numerados con el orden

en el que se escriben en el código.

En la imagen se puede ver el resultado final acompañada de la representación
sobre la manera de definirlos. En primer lugar definimos una estructura de
frames en dos columnas y dentro de la primera columna colocamos otra parcición
de frames en dos filas. El código necesario es el siguiente.


<frameset cols="200,*">

    <frameset rows="170,*">

       <frame src="pagina1.html">

       <frame src="pagina2.html">

    </frameset>

    <frame src="pagina3.html">

</frameset> 

Nota: hemos colocado un margen en cada una de las líneas de esta definición de frames para conseguir un código más entendible visualmente. Estos márgenes no son en absoluto necesarios, simplemente nos sirven para ver en qué nivel de anidación nos encontramos.

El ejemplo anterior se puede complicar un poco más si incluimos más particiones.
Vamos a ver algo un poco más complicado para practicar más con las anidaciones
de frames.

Los pasos para definir la anidación se pueden encontrar
a la derecha.

Los distintos frames vienen numerados con el orden

en el que se escriben en el código.


En la imagen se observa que el primer frameset a definir se compone de dos filas.
Posteriormente, dentro de la segunda fila del primer frameset, tenemos otra
partición en dos columnas, dentro de las que colocamos un tercer nivel de
frameset con una definción en filas en los dos casos. El código se puede ver a
continuación.



<frameset rows="60,*">

    <frame src="pagina1.html">

    <frameset cols="200,*">

       <frameset rows="*,150">

          <frame src="pagina2.html">

          <frame src="pagina3.html">

       </frameset>

       <frameset rows="*,60">

          <frame src="pagina4.html">

          <frame src="pagina5.html">

       </frameset>

    </frameset>

</frameset>



Hasta aquí hemos visto la parte más básica de la creación de frames. En los
siguientes capítulos podremos aprender a configurar los marcos para variar su
apariencia y, entre otras cosas, eliminar las barras que separan cada uno de los
distintos frames.

Tutoriales relacionados con 'Completo tutorial de HTML'

Anuncios Google

Autor y licencia de 'Completo tutorial de HTML'

Tutorial de Indaya.com. Extraido de: http://www.indaya.com