etiquetas para el trabajo con marcos n.
Download
Skip this Video
Loading SlideShow in 5 Seconds..
Etiquetas para el trabajo con Marcos PowerPoint Presentation
Download Presentation
Etiquetas para el trabajo con Marcos

Loading in 2 Seconds...

play fullscreen
1 / 22

Etiquetas para el trabajo con Marcos - PowerPoint PPT Presentation


  • 151 Views
  • Uploaded on

Etiquetas para el trabajo con Marcos. Los marcos (frames ) permiten dividir la pantalla en bloques de diferente tamaño, de modo que la información queda organizada de acuerdo con el gusto o las necesidades de quien diseñe la página Web. Etiquetas para el trabajo con Marcos.

loader
I am the owner, or an agent authorized to act on behalf of the owner, of the copyrighted work described.
capcha
Download Presentation

PowerPoint Slideshow about 'Etiquetas para el trabajo con Marcos' - harvey


An Image/Link below is provided (as is) to download presentation

Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.


- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -
Presentation Transcript
etiquetas para el trabajo con marcos
Etiquetas para el trabajo con Marcos

Los marcos (frames) permiten dividir la pantalla en bloques de diferente tamaño, de modo que la información queda organizada de acuerdo con el gusto o las necesidades de quien diseñe la página Web.

etiquetas para el trabajo con marcos1
Etiquetas para el trabajo con Marcos

Una pantalla basada en marcos consta de varios documentos HTML, lo cual contrasta con las pantallas que hemos diseñado hasta el momento.

Las páginas Web más simples hacen corresponder un solo documento HTML con la pantalla visualizada. Esta concepción se modifica con los marcos, ya que son necesarios varios documentos HTML para generar una pantalla en la ventana del navegador. Por ejemplo consideremos la siguiente figura.

etiquetas para el trabajo con marcos3
Etiquetas para el trabajo con Marcos

En el ejemplo anterior, cada zona es un marco. Para definir un marco es necesario disponer de una página HTML. Por este motivo, en la figura anterior se utilizan 3 documentos HTML para cada marco, además del documento HTML que define el conjunto de marcos

atributo target
Atributo TARGET

En particular nos interesa el atributo TARGET de la etiqueta <A> empleada para la gestión de hipervínculos.

La sintaxis es la siguiente:

TARGET=“nombre_de_la_ventana”

El atributo TARGET le indica al navegador que debe presentar una nueva ventana cuyo nombre es “nombre_de_la_ventana”, y en cuyo interior se despliega la información señalada por el hipervínculo.

atributo target1
Atributo TARGET

El nombre de la nueva ventana no debe de comenzar con el signo subrayado (_), debido a que este símbolo forma parte de ciertas palabras reservadas usadas con el comando TARGET.

Un ejemplo de la utilización de este atributo es:

<A HREF=“ventana2.html” TARGET=“ventana_dos”> Abrir </A>

ejercicio
Ejercicio:

Cree los siguientes archivos HTML, como se muestra a continuación:

ejercicio1
Ejercicio:

A continuación cree el siguiente archivo HTML:

La idea es que al click en el link abrir, se abra la página en otra venta, posteriormente al hacer click en cargar se abra sobre la ventana en el cual se cargo el link Abrir.

atributo base
Atributo Base

Es muy común que varios hipervínculos apunten a la misma página, en especial cuando se trabaja con marcos.

Para esto, podemos utilizar el atributo <BASE>, ya que con éste, se pueden definir globalmente el destino de todos los hipervínculos de la página Web. En especial si se coloca el atributo <BASE> en la sección <HEAD>…</HEAD> del documento.

En el siguiente ejemplo, los hipervínculos Productos y Servicios despliegan su contenido en la ventana “información”.

ejemplo del atributo base
Ejemplo del atributo Base

<HTML>

<HEAD>

<BASE TARGET=“información”>

</HEAD>

<BODY>

<A HREF=“productos.html”> Productos</A>

<A HREF=“servicios.html”> Servicios</A>

<A HREF=“mantenimiento.html” TARGET=“mantenimiento>Mantenimiento</A>

</BODY>

</HTML>

etiqueta frameset frameset
Etiqueta <FRAMESET>…<FRAMESET>

La etiqueta <FRAMESET> se utiliza para crear el documento de definición de marco. Es importante observar que esta etiqueta reemplaza a la etiqueta <BODY>, lo cual significa que ambas etiquetas son incompatibles.

Un documento que contenga una etiqueta <FRAMESET> es un documento de definición de marcos, y no debe contener ninguna otra etiqueta de formato o hipervínculo, ni texto informativo de ninguna naturaleza.

etiqueta frameset frameset1
Etiqueta <FRAMESET>…<FRAMESET>

La etiqueta <FRAMESET> posee dos atributos esenciales, COLS y ROWS, utilizados para definir el número de marcos verticales (COLS) y el número de marcos horizontales (ROWS) que serán visualizados en la pantalla del navegador.

El ancho de las columnas, o la altura de las filas se puede expresar de tres maneras diferentes: en píxeles, como porcentaje del ancho total, o con una asterisco (*).

Cuando se usa el (*), el navegador asignará el ancho posible al marco especificado.

etiqueta frameset frameset2
Etiqueta <FRAMESET>…<FRAMESET>

<FRAMESET COLS=“80,50%,*”>

La etiqueta mostrada crea una pantalla con tres marcos verticales, el primero de 80 píxeles, el segundo ocupa el 50% del ancho total de la ventana, y el último ocupa el espacio restante.

etiqueta frame
Etiqueta <FRAME>

Una vez definido el conjunto básico de marcos, se requiere asociar un documento HTML con cada marco del documento de definición de marcos. Esto se consigue con la etiqueta <FRAME>, cuya sintaxis es la siguiente:

<FRAME SRC=“URL del documento”>

etiqueta frame1
Etiqueta <FRAME>

Por cada marco definido con la etiqueta <FRAMESET> debe utilizar la correspondiente etiqueta <FRAME>. Para ilustrar el uso de estas etiquetas vamos a escribir un documento HTML que defina tres marcos horizontales, y en cada uno de ellos vamos a presentar el contenido de las páginas ventana1.html, ventana2.html y ventana3.html creadas anteriormente.

c digo del ejemplo
Código del Ejemplo

<HTML>

<HEAD>

<TITLE>Marcos </TITLE>

</HEAD>

<FRAMESET ROWS="50%,20%,30%">

<FRAME SRC="ventana1.html" SCROLLING="NO">

<FRAME SRC="ventana2.html" SCROLLING="NO">

<FRAME SRC="ventana3.html" SCROLLING="NO">

</FRAMESET>

</HTML>

atributos de la etiqueta frame
Atributos de la etiqueta Frame

SCROLLING=“AUTO”. Es el valor predeterminado. Con este atributo se agregan barras de desplazamiento horizontal y vertical.

SCROLLING=“NO”. Se desactivan las barras de desplazamiento del marco, tanto la horizontal como la vertical.

NORESIZE. Con esta opción se impide que el usuario pueda modificar la posición del marco dentro de la pantalla.

MARGINHEIGHT=píxeles. Permite ajustar el margen superior e inferior del marco dentro del documento. Su valor debe de darse en píxeles.

MARGIINWIDTH=píxeles. Permite ajustar el margen superior e inferior del marco dentro del documento. Su valor debe de darse en píxeles.

Los atributos FRAMEBORDER=YES | NO, y BORDERCOLOR=uncolor de la etiqueta FRAME determinan si un marco tiene o no borde y el color del mismo.

atributos de la etiqueta frame1
Atributos de la etiqueta Frame

<NOFRAMES>… </NOFRAMES>

Con esta etiqueta se garantiza que aquellos browser que no posean soporte para marcos, desplieguen una información descriptiva en relación con los marcos no visualizados.

ejemplo1
Ejemplo

<HTML>

<HEAD>

<TITLE> Ejemplo </TITLE>

</HEAD>

<FRAMESET ROWS=“20%,*”>

<FRAME SRC=“menu.hml” NAME=“superior”>

<FRAME SRC=“inicio.hml” NAME=“principal”>

</HTML>

ejemplo2
Ejemplo

<HTML>

<HEAD>

<TITLE> Menu </TITLE>

</HEAD>

<BODY>

<TABLE>

<TR>

<TD>

<A HREF=“inicio.html” TARGET=“principal”>Inicio </A>

</TD>

<TD>

<A HREF=“curriculum.html” TARGET=“principal”>Curriculum </A>

</TD>

<TD>

<A HREF=“cursos.html” TARGET=“principal”>Cursos</A>

</TD>

</TR>

</TABLE>

</BODY>

</HTML>