Leccion 20 capas
Descargar como PPTX, PDF0 recomendaciones193 vistas
Este documento explica cómo insertar y dar formato a capas en una página web. Las capas permiten agregar contenido como texto e imágenes en cualquier parte de la página y pueden solaparse y ocultarse. El documento describe cómo insertar una capa, moverla y redimensionarla, y especifica las propiedades como posición, tamaño, índice z, visibilidad y fondo que se pueden configurar para dar formato a cada capa.
Leccion 20 capas
- 1. Capas • Introducción • Insertar una capa • Formato de una capa Objetivo: El alumno conocerá en forma integral: Trabajo Con capas –layers-. Configuración y propiedades de las capas. Practica de confirmación: Insertar diferentes capas a las paginas web , agregando información adicional como imágenes y texto Resultados, No Excusas, Termina todo lo que Empiezas, Trabajo en Equipo
- 2. Las capas no son más que unos recuadros, que pueden situarse en cualquier parte de la página (es decir, que tienen una posición absoluta en la página), en los que podemos insertar contenido HTML. Dichas capas pueden ocultarse y solaparse entre sí, lo que proporciona grandes posibilidades de diseño. Las capas pueden moverse de una posición a otra de la ventana pulsando sobre el recuadro blanco, y sin soltar el ratón, arrastrándola hacia la nueva posición También pueden ser redimensionadas pulsando sobre los recuadros azules, y arrastrándolos hasta conseguir el tamaño deseado Resultados, No Excusas, Termina todo lo que Empiezas, Trabajo en Equipo
- 3. Las capas pueden insertarse en una página a través del menú Insertar, opción Objeto de diseño, Div PA (Elemento con Posición Absoluta). Una vez se ha insertado la capa, pueden editarse sus atributos, pero para ello hay que seleccionarla primero. Resultados, No Excusas, Termina todo lo que Empiezas, Trabajo en Equipo
- 4. Cuando existen varias capas en un mismo documento, es preferible seleccionarlas a través de la pestaña Elementos PA del panel CSS, que puede abrirse a través del menú Ventana opción Elementos PA. También puedes abrir el panel pulsando F2 Resultados, No Excusas, Termina todo lo que Empiezas, Trabajo en Equipo
- 5. Formato de una capa Las propiedades de la capa se especifican a través de su inspector de propiedades 1. Elemento CSS-P es el nombre de la capa. También puede ser cambiado a través del panel Elementos PA, haciendo doble clic sobre él. 2. Izq y Sup indican la distancia en píxeles que hay entre los límites izquierdo y superior del documento y la capa. 3. An y Al indican la anchura y la altura de la capa. 4. Índice Z es el número de orden de colocación de las capas. Este valor también puede cambiarse a través del panel Elementos PA. Una capa será solapada por aquellas capas cuyo índice Z sea mayor que el suyo. 5. Vis indica la visibilidad inicial de la capa. La visibilidad puede ser de cuatro tipos: 6. Default (visibilidad según el navegador), 7. Inherit (se muestra la capa mientras la página a la que pertenece también se esté mostrando), 8. Visible (muestra la capa, aunque la página no se esté viendo) y 9. Hidden (la capa está oculta). 10. La visibilidad también puede cambiarse a través del panel Elementos PA, pulsando sobre la imagen del ojo. El ojo abierto indica Visible, y el ojo cerrado indica Hidden. 11. A través de Im. fondo y Col puede indicarse una imagen o un color de fondo para la capa. 12. Desb. (Desbordamiento) controla cómo aparecen las capas en un navegador cuando el contenido excede el tamaño especificado de la capa. 13. Visible indica que el contenido adicional aparece en la capa. La capa se amplía para darle cabida. 14. Hidden (oculto) especifica que el contenido adicional no se mostrará en el navegador. 15. Scroll (desplazamiento) especifica que el navegador deberá añadir barras de desplazamiento a la capa tanto si se necesitan como si no. 16. Auto (automático) hace que el navegador muestre barras de desplazamiento para la capa cuando sean necesarias (es decir, cuando el contenido de la capa supere sus límites). Resultados, No Excusas, Termina todo lo que Empiezas, Trabajo en Equipo