Formato para prácticas de laboratorio
Anuncio
Fecha de efectividad: __________________ No se puede mostrar la imagen. Puede que su equipo no tenga suficiente memoria para abrir la imagen o que ésta esté dañada. Reinicie el equipo y , a continuación, abra el archiv o de nuev o. Si sigue apareciendo la x roja, puede que tenga que borrar la imagen e insertarla de nuev o. UNIVERSIDAD AUTÓNOMA DE BAJA CALIFORNIA FACULTAD DE INGENIERÍA (UNIDAD MEXICALI) DOCUMENTO DEL SISTEMA DE CALIDAD Formato para prácticas de laboratorio CARRERA PLAN DE ESTUDIO CLAVE ASIGNATURA LSC 2003-1 5233 PRÁCTICA No. 4 LABORATORIO DE NOMBRE DE LA PRÁCTICA NOMBRE DE LA ASIGNATURA Temas Selectos de Sistemas Computacionales Licenciado en Sistemas Computacionales DURACIÓN (HORA) Frames en HTML 2 1. INTRODUCCIÓN Al igual que las tablas los frames es otra manera de estructurar la información dentro de nuestros documentos HTML, estos nos permiten mostrar la información de distintas formas. 2. OBJETIVO (COMPETENCIA) El alumno complementar el diseño de su página web, integrando etiquetas para el manejo de frames para estructurar mejor la información y presentación con creatividad y de manera constante. Formuló M.C. Mónica Cristina Lam Mora Revisó M.C. Mónica Cristina Lam Mora Maestro Coordinador de la Carrera Aprobó Autorizó M.C. Miguel Ángel Martínez Romero Gestión de la Calidad Director de la Facultad 3. FUNDAMENTO La palabra "frame" significa "marco" o "borde", y su mismo nombre indica lo que la etiqueta <FRAME> puede hacer. Se utiliza para cargar dos o más páginas o archivos en una misma ventana del navegador. Un ejemplo de ello puede ser presentar el menú al lado izquierdo, y en el lado derecho mostrar la información de la opción seleccionada, cada uno de estos deberá ser un archivo aparte. Es por ello que primero tendremos que hacer un documento HTML en el que definiremos de cuántas zonas va a haber, qué distribución y tamaño van a tener, y cuál va ser el contenido de cada una de ellas. Página 1 de 6 Código Revisión GC-N4-017 . 1 . Fecha de efectividad: __________________ No se puede mostrar la imagen. Puede que su equipo no tenga suficiente memoria para abrir la imagen o que ésta esté dañada. Reinicie el equipo y , a continuación, abra el archiv o de nuev o. Si sigue apareciendo la x roja, puede que tenga que borrar la imagen e insertarla de nuev o. UNIVERSIDAD AUTÓNOMA DE BAJA CALIFORNIA FACULTAD DE INGENIERÍA (UNIDAD MEXICALI) DOCUMENTO DEL SISTEMA DE CALIDAD Formato para prácticas de laboratorio En el ejemplo que vamos a desarrollar, la página va a tener dos frames distribuidos en columnas (es decir, uno al lado del otro, en vez de uno encima del otro, lo que sería una distribución en filas). Con respecto al tamaño, haremos que el primero (el del izquierda) ocupe el 20% del ancho de la pantalla, y el otro, el 80% resta. Para crear un "Frameset" es decir, un conjunto de frames, debemos crear un archivo HTML nuevo, con las siguientes partes: <HTML> <HEAD> <TITLE> Título </TITLE> <FRAMESET> <FRAME> <FRAME> </FRAMESET> </HEAD> </HTML> Como podemos observar, este archivo no contiene la etiqueta body, ya que el archivo por sí solo no mostrará nada en el navegador, solo un par de archivos que en este caso, no se pueden encontrar, ya que no especificamos una ruta para cada uno de los archivos. Ahora, si incluímos la ruta de los archivos y el tipo de separación de la ventana (en columnas o filas), el código debe ser el siguiente: <HTML> <HEAD> <TITLE> Título </TITLE> <FRAMESET COLS="150,*" BORDER="0"> <FRAME NAME="izquierda" SRC=" menu.html"> <FRAME NAME="derecha" SRC="principal.html”> </FRAMESET> </HEAD> </HTML> Este archivo cargará en el navegador dos archivos diferentes de html en una sola ventana, Página 2 de 6 Código Revisión GC-N4-017 . 1 . Fecha de efectividad: __________________ No se puede mostrar la imagen. Puede que su equipo no tenga suficiente memoria para abrir la imagen o que ésta esté dañada. Reinicie el equipo y , a continuación, abra el archiv o de nuev o. Si sigue apareciendo la x roja, puede que tenga que borrar la imagen e insertarla de nuev o. UNIVERSIDAD AUTÓNOMA DE BAJA CALIFORNIA FACULTAD DE INGENIERÍA (UNIDAD MEXICALI) DOCUMENTO DEL SISTEMA DE CALIDAD Formato para prácticas de laboratorio lógicamente estos dos archivos deben estar creados con anterioridad. <FRAMESET> </FRAMESET> Esta etiqueta nos permite crear el conjunto de marcos que deseamos en una determinada página. Sus atributos son: COLS ROWS BORDER Indica que el "frameset" estará dividido en columnas, es decir, verticalmente. Los valores que lleva este atributo se dan en los formatos: "150,20%,*" en donde 150 está en pixeles, 20% es el ancho que tendrá esa columna en relación a toda la página y * indica que la tercer columna será del ancho restante de la página. Funciona de forma similar a COLS pero en este caso indica que la ventana será dividida en filas, dándole los valores de la misma forma que a las columnas (en pixeles o porcentaje, o bien con *) Indica el ancho del borde que existirá entre los frames. Su valor está dado en pixeles: BORDER="2" o bien, para que no exista división entre los frames: BORDER="0". <FRAME> Esta etiqueta define las características de un frame concreto, no del conjunto de los frames, como era el caso con la etiqueta <FRAMESET>. Sus atributos son: NAME Es el nombre que recibe el frame. Este atributo se utiliza para las ligas con el atributo TARGET. NAME= “nombre de la ventana”. SRC Se utiliza para indicar la ruta donde se encuentra el archivo que será desplegado dentro del frame. SRC=”dirección”. Página 3 de 6 Código Revisión GC-N4-017 . 1 . Fecha de efectividad: __________________ No se puede mostrar la imagen. Puede que su equipo no tenga suficiente memoria para abrir la imagen o que ésta esté dañada. Reinicie el equipo y , a continuación, abra el archiv o de nuev o. Si sigue apareciendo la x roja, puede que tenga que borrar la imagen e insertarla de nuev o. UNIVERSIDAD AUTÓNOMA DE BAJA CALIFORNIA FACULTAD DE INGENIERÍA (UNIDAD MEXICALI) DOCUMENTO DEL SISTEMA DE CALIDAD Formato para prácticas de laboratorio SCROLLING Sus valores son "yes", "no" y "auto". Se utiliza para especificar si el frame mostrará las barras de desplazamiento (scroll bars): yes - El frame mostrará las barras, incluso si el archivo cabe en la ventana sin tener que desplazarse. no - El frame no mostrará las barras. Si el archivo es mas ancho o alto que la ventana del frame, el usuario no podrá desplazarse para poder ver el archivo completo. auto - Si el archivo es lo suficientemente ancho o alto, el navegador mostrará las barras de desplazamiento. De forma contraria, si el archivo cabe en la ventana, no aparecerán las barras de desplazamiento. SCROLLING =”no”. NORESIZE Significa "no re-size", lo cual nos indica que el usuario no podrá cambiar el ancho y/o alto de los frames; es decir, no podrá mover la división que existe entre estos. Ejemplo: Este código será para el archivo index de nuestra página web <HTML> <HEAD> <TITLE> Título </TITLE> <FRAMESET COLS="250,*" BORDER="0"> <FRAME NAME="menu" src="menu.html"> <FRAME NAME="derecha" SRC="principal.html" NORESIZE SCROLLING="auto"> </FRAMESET> </HEAD> </HTML> El cual dará un resultado similar a este: Página 4 de 6 Código Revisión GC-N4-017 . 1 . Fecha de efectividad: __________________ No se puede mostrar la imagen. Puede que su equipo no tenga suficiente memoria para abrir la imagen o que ésta esté dañada. Reinicie el equipo y , a continuación, abra el archiv o de nuev o. Si sigue apareciendo la x roja, puede que tenga que borrar la imagen e insertarla de nuev o. UNIVERSIDAD AUTÓNOMA DE BAJA CALIFORNIA FACULTAD DE INGENIERÍA (UNIDAD MEXICALI) DOCUMENTO DEL SISTEMA DE CALIDAD Formato para prácticas de laboratorio Pero para esto deberá tener dos archivos para desplegar al lado izquierdo y derecho de los frames. 4. PROCEDIMIENTO (DESCRIPCIÓN) A) EQUIPO NECESARIO Computadora con acceso a un procesador de palabras básico. B) MATERIAL DE APOYO Cualquier libro o página web sobre html Práctica DESARROLLO DE LA PRÁCTICA Elabore una página web en donde visualice la información desplegada en frames según como lo desee mostrar el usuario. C) CÁLCULOS Y REPORTE Preguntas sobre la práctica de forma INDIVIDUAL, que hará el maestro al finalizar la práctica a cada alumno. 5. RESULTADOS Y CONCLUSIONES Los resultados serán solo a nivel de visualización, no serán impresos, estos podrán variar dependiendo de los datos de entrada que el alumno introduzca. Página 5 de 6 Código Revisión GC-N4-017 . 1 . Fecha de efectividad: __________________ No se puede mostrar la imagen. Puede que su equipo no tenga suficiente memoria para abrir la imagen o que ésta esté dañada. Reinicie el equipo y , a continuación, abra el archiv o de nuev o. Si sigue apareciendo la x roja, puede que tenga que borrar la imagen e insertarla de nuev o. UNIVERSIDAD AUTÓNOMA DE BAJA CALIFORNIA FACULTAD DE INGENIERÍA (UNIDAD MEXICALI) DOCUMENTO DEL SISTEMA DE CALIDAD Formato para prácticas de laboratorio 6. ANEXOS 7. REFERENCIAS Página 6 de 6 Código Revisión GC-N4-017 . 1 .
