Scribd Logo
Cargar

¡Te damos la bienvenida a Scribd!

  • Guia04 Frames

    Cargado por

    gclucitayary
    2 vistas4 páginas

    Título original

    Guia04 Frames (1)

    Derechos de autor

    © © All Rights Reserved

    Formatos disponibles

    PDF, TXT o lea en línea desde Scribd

    ¿Le pareció útil este documento?

    ¿Este contenido es inapropiado?

    Denunciar este documento

    Copyright:

    © All Rights Reserved
    Descargue como PDF, TXT o lea en línea desde Scribd
    Marcar por contenido inapropiado
    2 vistas4 páginas

    Guia04 Frames

    Cargado por

    gclucitayary

    Copyright:

    © All Rights Reserved
    Descargue como PDF, TXT o lea en línea desde Scribd
    Marcar por contenido inapropiado
    de 4

    DISEÑO CON FRAMES

    El diseño con frames es otra forma de diseñar la página en la cual utilizamos


    varios frames o marcos, (frame: en español significa "marco") de manera que
    cada uno de los frames consiste en un archivo html distinto. La página queda
    dividida en diferentes areas, cada una de esas áreas o frames es independiente
    del resto, y es en sí una página distinta, con un archivo html distinto; aunque las
    veamos todas en la misma ventana del navegador.
    Composición y etiquetas
    Una página compuesta con frames se compone de un archivo principal, con
    la definición de los frames o marcos que va a tener, y tantas páginas o archivos
    HTML como marcos vaya a tener.
    La página principal es una página en HTML, en la que la etiqueta <body> ...
    </body> es sustituida por la etiqueta <frameset> ... </frameset>.
    Dentro de la etiqueta frameset se insertan las etiquetas <frame
    src="ruta_de_la_página"/>. Cada etiqueta frame debe coincidir con una partición
    de la página, y el atributo src tiene la ruta al archivo html que irá en esa parte de
    la página. Los archivos html pueden ser tanto internos (del propio sitio web),
    como externos (de otros sitios web).
    Para hacer la partición de la página, la etiqueta frameset debe llevar el
    atributo cols (columnas) o rows (filas), para partir la página en varias columnas
    o en varias filas. La etiqueta frameset solo admite uno de estos dos atributos, por
    lo que debemos decidir cómo hacer la partición principal de la página, si en filas
    o columnas. Si queremos poner filas y columnas a la vez lo haremos anidando
    etiquetas frameset
    El numero de filas (o de columnas) y el espacio que van a ocupar, lo
    indicaremos en el valor del atributo rows (o cols), indicando el espacio ocupado
    por cada una de ellas, separados por comas, ejemplo:
    <frameset rows="20%,65%,15%">
    Esta sería una página partida horizontalmente en tres partes, la primera con
    un 20% de la pantalla, la segunda con un 65%, y la tercera con un 15%. Ademas
    de en tantos por ciento las medidas de los frames pueden expresarse en píxeles,
    para ello sólo hay que escribir el número de píxeles (sin "px" detrás). También
    podemos dejar una columna o fila sin definir el tamaño, para que ocupe todo el
    resto de la pantalla que no ocupan las demás, en ese caso, en lugar de
    porcentaje o número escribimos un asterisco ( * ). Ejemplo:
    <frameset cols="200,*,200">
    Este ejemplo indica una partición con dos columnas a derecha e izquierda
    de 200px cada una, y una columna central que ocupa el resto de la página.

    Ejemplo de página con frames


    Vamos a hacer un ejemplo clásico de página con cabecera, pie de página y
    diseño central a tres columnas (menú izquierdo, contenido, y lateral derecho). En
    principio partiremos la página en horizontal en tres partes (la cabecera, el cuerpo
    principal, y el pie de página).
    Resultado:

    Para hacer un diseño a tres columnas debemos partir el segundo frame en tres
    columnas, para ello, sustituiremos la etiqueta del segundo frame por una
    etiqueta frameset con un atributo cols que indique tres columnas, y dentro de
    esta etiqueta colocaremos las tres etiquetas frame de cada una de las columnas.

    Resultado:
    Atributos para las etiquetas de frames
    Etiqueta "frameset"
    Los atributos específicos para la etiqueta frameset, aparte de los
    atributos cols y rows ya vistos en la página anterior, son los siguientes:
    ▪ border="número de píxeles": Indica el número de píxeles que tendrá el borde
    de los frames. Debemos escribir simplemente el número.
    ▪ bordercolor="#rrggbb": Indica el color del borde de los frames. Los colores
    pueden escribirse en el método RGB hexadecimal o también con sus
    palabras clave.
    ▪ frameborder="yes|no|0":Muestra o no el el borde de los frames. Sus valores
    posibles son yes (se ven los bordes), no ó 0 (no se ven los bordes).
    Elimina el borde, pero permanece una línea de separación entre los
    frames. Este atributo no funciona con Internet Explorer.
    ▪ framespacing="número de píxeles": Determina la anchura de la línea de
    píxeles, se utiliza con el valor framespacing="0", para eliminar los bordes
    en Internet Explorer.

    Etiqueta "frame"
    Los atributos específicos para la etiqueta frame, son los siguientes:
    ▪ marginwidth="número de píxeles": indica el número de píxeles de separación
    entre el borde del frame y su contenido, tanto por su margen izquierdo
    como derecho.
    ▪ marginheight="número de píxeles": indica el número de píxeles de
    separación entre el borde del frame y su contenido, tanto por su margen
    superior como inferior.
    ▪ scrolling="yes|no|auto": Indica si queremos que haya barras de
    desplazamiento; el valor yes indica que se verán siempre; el
    valor no indica que no se verán nunca, y el valor auto indica que se verán
    sólo si son necesarias. El valor auto es el valor por defecto.
    ▪ noresize: este atributo no tiene valores. podemos ponerlo o no ponerlo, si
    bien en código XHTML deberemos escribir: noresize="noresize". Una
    característica de los frames es que se pueden redimensionar, es decir,
    cuando colocamos el ratón en el borde de un frame, sale un cursor con
    doble flecha, que señala que podemos mover dicho borde, y así cambiar
    el tamaño de los frames. Al poner este atributo los frames quedan fijos y
    no pueden redimensionarse.
    ▪ frameborder="yes|no|0": funciona igual que con la etiqueta frameset pero
    sólo para el frame especificado.
    ▪ bordercolor="#rrggbb": como el anterior, funciona igual que con la
    etiqueta frameset pero sólo para el frame especificado.

    Eliminar los bordes


    Como hemos visto hay varios atributos para eliminar los bordes de los
    frames, unos funcionan con unos navegadores, y otros con otros. para
    estar seguros de que eliminamos los bordes en los navegadores más
    habituales, en la etiqueta frameset principal debemos escribir el siguiente
    código:
    <frameset border="0" frameborder="0" framespacing="0" ... >
    Estos atributos debemos repetirlos también en las
    etiquetas frameset anidadas, para que la página se vea sin ningún borde
    en algunos navegadores como Safari o Google Chrome.
    Al eliminar los bordes eliminamos también la posibilidad de
    redimensionar los frames, con lo que es como si pusieramos también la
    etiqueta noresize. Si queremos que los frames se puedan redimensionar
    deberemos dejar algo de borde, que podemos disimularlo dándole el
    mismo color que al interior del frame, mediante el atributo bordercolor.
    Veamos el ejemplo del apartado anterior, al cual se le han eliminado
    los bordes al aplicar los atributos anteriores:

    Trabajo:
    Crear una aplicación en un frame que inserte un video
    Crear una aplicación en un frame que inserte un audio
    Crear una aplicación en un frame que inserte un video de YouTube

    Referencia:
    https://aprende-web.net/html/html9_1.php
    https://informaticapc.com/tutorial-html/frames.php
    https://www.eniun.com/marcos-frames-html5/

    También podría gustarte