SlideShare una empresa de Scribd logo
1 de 5
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
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
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
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
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

Más contenido relacionado

La actualidad más candente (16)

Tutorial spicy nodes
Tutorial spicy nodesTutorial spicy nodes
Tutorial spicy nodes
 
El entorno de trabajo en flash
El entorno de trabajo en flashEl entorno de trabajo en flash
El entorno de trabajo en flash
 
Manual del xmind
Manual del  xmind Manual del  xmind
Manual del xmind
 
Flash
FlashFlash
Flash
 
Taller 1
Taller 1Taller 1
Taller 1
 
fuente de poder
fuente de poderfuente de poder
fuente de poder
 
Instructivo Photoshop
Instructivo PhotoshopInstructivo Photoshop
Instructivo Photoshop
 
Tutorial de word 2010
Tutorial de word 2010Tutorial de word 2010
Tutorial de word 2010
 
Conociendo Adobe Fireworks 2015
Conociendo Adobe Fireworks 2015Conociendo Adobe Fireworks 2015
Conociendo Adobe Fireworks 2015
 
Salto seccion pie_pagina_word2010
Salto seccion pie_pagina_word2010Salto seccion pie_pagina_word2010
Salto seccion pie_pagina_word2010
 
Ventana Gráfica - Small Basic
Ventana Gráfica - Small BasicVentana Gráfica - Small Basic
Ventana Gráfica - Small Basic
 
Diseño de-una-diapositiva
Diseño de-una-diapositivaDiseño de-una-diapositiva
Diseño de-una-diapositiva
 
El objeto Controls - Small Basic
El objeto Controls - Small BasicEl objeto Controls - Small Basic
El objeto Controls - Small Basic
 
Entorno visual de word 2010 UFT
Entorno visual de word 2010 UFT Entorno visual de word 2010 UFT
Entorno visual de word 2010 UFT
 
Perfiles topográficos mediante google earth jesse benitez bello
Perfiles  topográficos  mediante google  earth  jesse benitez belloPerfiles  topográficos  mediante google  earth  jesse benitez bello
Perfiles topográficos mediante google earth jesse benitez bello
 
Flash
FlashFlash
Flash
 

Similar a Leccion 20 capas

7 comportamiento de capas
7 comportamiento de capas7 comportamiento de capas
7 comportamiento de capasMarianmv
 
Ventana de dreamweaver
Ventana de dreamweaverVentana de dreamweaver
Ventana de dreamweaverMajoromeroi
 
Acciones Mas Comunes Sobre Capas
Acciones Mas Comunes Sobre CapasAcciones Mas Comunes Sobre Capas
Acciones Mas Comunes Sobre Capasbetzi.15
 
09 Dibujo Vectorial Con Draw. Capas
09 Dibujo Vectorial Con Draw. Capas09 Dibujo Vectorial Con Draw. Capas
09 Dibujo Vectorial Con Draw. CapasJosé M. Padilla
 
Curso de diseño ilustrador cs5
Curso de diseño ilustrador cs5Curso de diseño ilustrador cs5
Curso de diseño ilustrador cs5abranpaso
 
Diseño grafico 1del segundo mes
Diseño grafico 1del segundo mesDiseño grafico 1del segundo mes
Diseño grafico 1del segundo mesEsmeralda2227
 
gvSIG: Proyectos y Documentos
gvSIG: Proyectos y DocumentosgvSIG: Proyectos y Documentos
gvSIG: Proyectos y DocumentosMaryadelMar85
 
gvSIG visualización y navegación
gvSIG visualización y navegacióngvSIG visualización y navegación
gvSIG visualización y navegaciónMaryadelMar85
 
Computacion creacion de texto metalico
Computacion   creacion de texto metalicoComputacion   creacion de texto metalico
Computacion creacion de texto metalicoErika156
 

Similar a Leccion 20 capas (20)

7 comportamiento de capas
7 comportamiento de capas7 comportamiento de capas
7 comportamiento de capas
 
Guia4de Dreamweaver
Guia4de DreamweaverGuia4de Dreamweaver
Guia4de Dreamweaver
 
Ventana de dreamweaver
Ventana de dreamweaverVentana de dreamweaver
Ventana de dreamweaver
 
Photoshop CS6. capas
Photoshop CS6. capasPhotoshop CS6. capas
Photoshop CS6. capas
 
Acciones Mas Comunes Sobre Capas
Acciones Mas Comunes Sobre CapasAcciones Mas Comunes Sobre Capas
Acciones Mas Comunes Sobre Capas
 
09 Dibujo Vectorial Con Draw. Capas
09 Dibujo Vectorial Con Draw. Capas09 Dibujo Vectorial Con Draw. Capas
09 Dibujo Vectorial Con Draw. Capas
 
parte 4 manual 2022.pdf
parte 4 manual 2022.pdfparte 4 manual 2022.pdf
parte 4 manual 2022.pdf
 
Curso de diseño ilustrador cs5
Curso de diseño ilustrador cs5Curso de diseño ilustrador cs5
Curso de diseño ilustrador cs5
 
Capas en Photoshop
Capas  en PhotoshopCapas  en Photoshop
Capas en Photoshop
 
Diseño grafico 1del segundo mes
Diseño grafico 1del segundo mesDiseño grafico 1del segundo mes
Diseño grafico 1del segundo mes
 
Dreamweader
DreamweaderDreamweader
Dreamweader
 
gvSIG: Proyectos y Documentos
gvSIG: Proyectos y DocumentosgvSIG: Proyectos y Documentos
gvSIG: Proyectos y Documentos
 
Tabla dwcs5
Tabla dwcs5Tabla dwcs5
Tabla dwcs5
 
gvSIG visualización y navegación
gvSIG visualización y navegacióngvSIG visualización y navegación
gvSIG visualización y navegación
 
Capas
CapasCapas
Capas
 
Capas
CapasCapas
Capas
 
Informe de bre k..
Informe de bre k..Informe de bre k..
Informe de bre k..
 
Tema09.pptx.pdf
Tema09.pptx.pdfTema09.pptx.pdf
Tema09.pptx.pdf
 
Capas en html
Capas en htmlCapas en html
Capas en html
 
Computacion creacion de texto metalico
Computacion   creacion de texto metalicoComputacion   creacion de texto metalico
Computacion creacion de texto metalico
 

Más de Flor Aguilar

Ejercicio 1 prueba de practicas para certificación de SolidWorks
Ejercicio 1 prueba de practicas para certificación de SolidWorksEjercicio 1 prueba de practicas para certificación de SolidWorks
Ejercicio 1 prueba de practicas para certificación de SolidWorksFlor Aguilar
 
Leccion 17 html desde dreamweaver
Leccion 17 html desde dreamweaverLeccion 17 html desde dreamweaver
Leccion 17 html desde dreamweaverFlor Aguilar
 
Leccion12 dream.flor
Leccion12 dream.florLeccion12 dream.flor
Leccion12 dream.florFlor Aguilar
 
Leccion 19.otros elementos
Leccion 19.otros elementosLeccion 19.otros elementos
Leccion 19.otros elementosFlor Aguilar
 
Leccion 18 html desde dreamweaver 2
Leccion 18 html desde dreamweaver 2Leccion 18 html desde dreamweaver 2
Leccion 18 html desde dreamweaver 2Flor Aguilar
 
Leccion 17 html desde dreamweaver
Leccion 17 html desde dreamweaverLeccion 17 html desde dreamweaver
Leccion 17 html desde dreamweaverFlor Aguilar
 
Leccion 16.plantillas
Leccion 16.plantillasLeccion 16.plantillas
Leccion 16.plantillasFlor Aguilar
 
Leccion 15 sonido y videos
Leccion 15 sonido y videosLeccion 15 sonido y videos
Leccion 15 sonido y videosFlor Aguilar
 
Leccion14.multimedia1.dream flor
Leccion14.multimedia1.dream florLeccion14.multimedia1.dream flor
Leccion14.multimedia1.dream florFlor Aguilar
 
Leccion13 formularios dream
Leccion13 formularios dreamLeccion13 formularios dream
Leccion13 formularios dreamFlor Aguilar
 
Leccion12 dream.flor
Leccion12 dream.florLeccion12 dream.flor
Leccion12 dream.florFlor Aguilar
 
Leccion 11 dream.flor
Leccion 11 dream.florLeccion 11 dream.flor
Leccion 11 dream.florFlor Aguilar
 
Leccion 11 dream.flor
Leccion 11 dream.florLeccion 11 dream.flor
Leccion 11 dream.florFlor Aguilar
 
Leccion13 formularios dream
Leccion13 formularios dreamLeccion13 formularios dream
Leccion13 formularios dreamFlor Aguilar
 
Leccion14.multimedia1.dream flor
Leccion14.multimedia1.dream florLeccion14.multimedia1.dream flor
Leccion14.multimedia1.dream florFlor Aguilar
 
Leccion12 dream.flor
Leccion12 dream.florLeccion12 dream.flor
Leccion12 dream.florFlor Aguilar
 

Más de Flor Aguilar (20)

Ejercicio 1 prueba de practicas para certificación de SolidWorks
Ejercicio 1 prueba de practicas para certificación de SolidWorksEjercicio 1 prueba de practicas para certificación de SolidWorks
Ejercicio 1 prueba de practicas para certificación de SolidWorks
 
Leccion 17 html desde dreamweaver
Leccion 17 html desde dreamweaverLeccion 17 html desde dreamweaver
Leccion 17 html desde dreamweaver
 
Leccion12 dream.flor
Leccion12 dream.florLeccion12 dream.flor
Leccion12 dream.flor
 
Leccion 19.otros elementos
Leccion 19.otros elementosLeccion 19.otros elementos
Leccion 19.otros elementos
 
Leccion 18 html desde dreamweaver 2
Leccion 18 html desde dreamweaver 2Leccion 18 html desde dreamweaver 2
Leccion 18 html desde dreamweaver 2
 
Leccion 17 html desde dreamweaver
Leccion 17 html desde dreamweaverLeccion 17 html desde dreamweaver
Leccion 17 html desde dreamweaver
 
Leccion 16.plantillas
Leccion 16.plantillasLeccion 16.plantillas
Leccion 16.plantillas
 
Leccion 15 sonido y videos
Leccion 15 sonido y videosLeccion 15 sonido y videos
Leccion 15 sonido y videos
 
Leccion14.multimedia1.dream flor
Leccion14.multimedia1.dream florLeccion14.multimedia1.dream flor
Leccion14.multimedia1.dream flor
 
Leccion13 formularios dream
Leccion13 formularios dreamLeccion13 formularios dream
Leccion13 formularios dream
 
Leccion12 dream.flor
Leccion12 dream.florLeccion12 dream.flor
Leccion12 dream.flor
 
Leccion 11 dream.flor
Leccion 11 dream.florLeccion 11 dream.flor
Leccion 11 dream.flor
 
Leccion 11 dream.flor
Leccion 11 dream.florLeccion 11 dream.flor
Leccion 11 dream.flor
 
Leccion13 formularios dream
Leccion13 formularios dreamLeccion13 formularios dream
Leccion13 formularios dream
 
Leccion14.multimedia1.dream flor
Leccion14.multimedia1.dream florLeccion14.multimedia1.dream flor
Leccion14.multimedia1.dream flor
 
Leccion12 dream.flor
Leccion12 dream.florLeccion12 dream.flor
Leccion12 dream.flor
 
Leccion 10 dream
Leccion 10 dreamLeccion 10 dream
Leccion 10 dream
 
Leccion 9 dream
Leccion 9 dreamLeccion 9 dream
Leccion 9 dream
 
Leccion 8 dream
Leccion 8 dreamLeccion 8 dream
Leccion 8 dream
 
Leccion 7 dream
Leccion 7 dreamLeccion 7 dream
Leccion 7 dream
 

Último

SESION DE PERSONAL SOCIAL. La convivencia en familia 22-04-24 -.doc
SESION DE PERSONAL SOCIAL.  La convivencia en familia 22-04-24  -.docSESION DE PERSONAL SOCIAL.  La convivencia en familia 22-04-24  -.doc
SESION DE PERSONAL SOCIAL. La convivencia en familia 22-04-24 -.docRodneyFrankCUADROSMI
 
NUEVAS DIAPOSITIVAS POSGRADO Gestion Publica.pdf
NUEVAS DIAPOSITIVAS POSGRADO Gestion Publica.pdfNUEVAS DIAPOSITIVAS POSGRADO Gestion Publica.pdf
NUEVAS DIAPOSITIVAS POSGRADO Gestion Publica.pdfUPTAIDELTACHIRA
 
Tema 17. Biología de los microorganismos 2024
Tema 17. Biología de los microorganismos 2024Tema 17. Biología de los microorganismos 2024
Tema 17. Biología de los microorganismos 2024IES Vicent Andres Estelles
 
Biografía de Charles Coulomb física .pdf
Biografía de Charles Coulomb física .pdfBiografía de Charles Coulomb física .pdf
Biografía de Charles Coulomb física .pdfGruberACaraballo
 
TALLER DE DEMOCRACIA Y GOBIERNO ESCOLAR-COMPETENCIAS N°3.docx
TALLER DE DEMOCRACIA Y GOBIERNO ESCOLAR-COMPETENCIAS N°3.docxTALLER DE DEMOCRACIA Y GOBIERNO ESCOLAR-COMPETENCIAS N°3.docx
TALLER DE DEMOCRACIA Y GOBIERNO ESCOLAR-COMPETENCIAS N°3.docxNadiaMartnez11
 
Los avatares para el juego dramático en entornos virtuales
Los avatares para el juego dramático en entornos virtualesLos avatares para el juego dramático en entornos virtuales
Los avatares para el juego dramático en entornos virtualesMarisolMartinez707897
 
2 REGLAMENTO RM 0912-2024 DE MODALIDADES DE GRADUACIÓN_.pptx
2 REGLAMENTO RM 0912-2024 DE MODALIDADES DE GRADUACIÓN_.pptx2 REGLAMENTO RM 0912-2024 DE MODALIDADES DE GRADUACIÓN_.pptx
2 REGLAMENTO RM 0912-2024 DE MODALIDADES DE GRADUACIÓN_.pptxRigoTito
 
Revista Apuntes de Historia. Mayo 2024.pdf
Revista Apuntes de Historia. Mayo 2024.pdfRevista Apuntes de Historia. Mayo 2024.pdf
Revista Apuntes de Historia. Mayo 2024.pdfapunteshistoriamarmo
 
activ4-bloque4 transversal doctorado.pdf
activ4-bloque4 transversal doctorado.pdfactiv4-bloque4 transversal doctorado.pdf
activ4-bloque4 transversal doctorado.pdfRosabel UA
 
Plan-de-la-Patria-2019-2025- TERCER PLAN SOCIALISTA DE LA NACIÓN.pdf
Plan-de-la-Patria-2019-2025- TERCER PLAN SOCIALISTA DE LA NACIÓN.pdfPlan-de-la-Patria-2019-2025- TERCER PLAN SOCIALISTA DE LA NACIÓN.pdf
Plan-de-la-Patria-2019-2025- TERCER PLAN SOCIALISTA DE LA NACIÓN.pdfcarolinamartinezsev
 
Tema 10. Dinámica y funciones de la Atmosfera 2024
Tema 10. Dinámica y funciones de la Atmosfera 2024Tema 10. Dinámica y funciones de la Atmosfera 2024
Tema 10. Dinámica y funciones de la Atmosfera 2024IES Vicent Andres Estelles
 
Prueba de evaluación Geografía e Historia Comunidad de Madrid 4ºESO
Prueba de evaluación Geografía e Historia Comunidad de Madrid 4ºESOPrueba de evaluación Geografía e Historia Comunidad de Madrid 4ºESO
Prueba de evaluación Geografía e Historia Comunidad de Madrid 4ºESOluismii249
 
Prueba libre de Geografía para obtención título Bachillerato - 2024
Prueba libre de Geografía para obtención título Bachillerato - 2024Prueba libre de Geografía para obtención título Bachillerato - 2024
Prueba libre de Geografía para obtención título Bachillerato - 2024Juan Martín Martín
 
Tema 19. Inmunología y el sistema inmunitario 2024
Tema 19. Inmunología y el sistema inmunitario 2024Tema 19. Inmunología y el sistema inmunitario 2024
Tema 19. Inmunología y el sistema inmunitario 2024IES Vicent Andres Estelles
 
Infografía EE con pie del 2023 (3)-1.pdf
Infografía EE con pie del 2023 (3)-1.pdfInfografía EE con pie del 2023 (3)-1.pdf
Infografía EE con pie del 2023 (3)-1.pdfAlfaresbilingual
 
origen y desarrollo del ensayo literario
origen y desarrollo del ensayo literarioorigen y desarrollo del ensayo literario
origen y desarrollo del ensayo literarioELIASAURELIOCHAVEZCA1
 
Procedimientos para la planificación en los Centros Educativos tipo V ( multi...
Procedimientos para la planificación en los Centros Educativos tipo V ( multi...Procedimientos para la planificación en los Centros Educativos tipo V ( multi...
Procedimientos para la planificación en los Centros Educativos tipo V ( multi...Katherine Concepcion Gonzalez
 

Último (20)

SESION DE PERSONAL SOCIAL. La convivencia en familia 22-04-24 -.doc
SESION DE PERSONAL SOCIAL.  La convivencia en familia 22-04-24  -.docSESION DE PERSONAL SOCIAL.  La convivencia en familia 22-04-24  -.doc
SESION DE PERSONAL SOCIAL. La convivencia en familia 22-04-24 -.doc
 
NUEVAS DIAPOSITIVAS POSGRADO Gestion Publica.pdf
NUEVAS DIAPOSITIVAS POSGRADO Gestion Publica.pdfNUEVAS DIAPOSITIVAS POSGRADO Gestion Publica.pdf
NUEVAS DIAPOSITIVAS POSGRADO Gestion Publica.pdf
 
Tema 17. Biología de los microorganismos 2024
Tema 17. Biología de los microorganismos 2024Tema 17. Biología de los microorganismos 2024
Tema 17. Biología de los microorganismos 2024
 
Biografía de Charles Coulomb física .pdf
Biografía de Charles Coulomb física .pdfBiografía de Charles Coulomb física .pdf
Biografía de Charles Coulomb física .pdf
 
TALLER DE DEMOCRACIA Y GOBIERNO ESCOLAR-COMPETENCIAS N°3.docx
TALLER DE DEMOCRACIA Y GOBIERNO ESCOLAR-COMPETENCIAS N°3.docxTALLER DE DEMOCRACIA Y GOBIERNO ESCOLAR-COMPETENCIAS N°3.docx
TALLER DE DEMOCRACIA Y GOBIERNO ESCOLAR-COMPETENCIAS N°3.docx
 
Los avatares para el juego dramático en entornos virtuales
Los avatares para el juego dramático en entornos virtualesLos avatares para el juego dramático en entornos virtuales
Los avatares para el juego dramático en entornos virtuales
 
2 REGLAMENTO RM 0912-2024 DE MODALIDADES DE GRADUACIÓN_.pptx
2 REGLAMENTO RM 0912-2024 DE MODALIDADES DE GRADUACIÓN_.pptx2 REGLAMENTO RM 0912-2024 DE MODALIDADES DE GRADUACIÓN_.pptx
2 REGLAMENTO RM 0912-2024 DE MODALIDADES DE GRADUACIÓN_.pptx
 
Revista Apuntes de Historia. Mayo 2024.pdf
Revista Apuntes de Historia. Mayo 2024.pdfRevista Apuntes de Historia. Mayo 2024.pdf
Revista Apuntes de Historia. Mayo 2024.pdf
 
activ4-bloque4 transversal doctorado.pdf
activ4-bloque4 transversal doctorado.pdfactiv4-bloque4 transversal doctorado.pdf
activ4-bloque4 transversal doctorado.pdf
 
Plan-de-la-Patria-2019-2025- TERCER PLAN SOCIALISTA DE LA NACIÓN.pdf
Plan-de-la-Patria-2019-2025- TERCER PLAN SOCIALISTA DE LA NACIÓN.pdfPlan-de-la-Patria-2019-2025- TERCER PLAN SOCIALISTA DE LA NACIÓN.pdf
Plan-de-la-Patria-2019-2025- TERCER PLAN SOCIALISTA DE LA NACIÓN.pdf
 
Tema 10. Dinámica y funciones de la Atmosfera 2024
Tema 10. Dinámica y funciones de la Atmosfera 2024Tema 10. Dinámica y funciones de la Atmosfera 2024
Tema 10. Dinámica y funciones de la Atmosfera 2024
 
Prueba de evaluación Geografía e Historia Comunidad de Madrid 4ºESO
Prueba de evaluación Geografía e Historia Comunidad de Madrid 4ºESOPrueba de evaluación Geografía e Historia Comunidad de Madrid 4ºESO
Prueba de evaluación Geografía e Historia Comunidad de Madrid 4ºESO
 
Prueba libre de Geografía para obtención título Bachillerato - 2024
Prueba libre de Geografía para obtención título Bachillerato - 2024Prueba libre de Geografía para obtención título Bachillerato - 2024
Prueba libre de Geografía para obtención título Bachillerato - 2024
 
Tema 19. Inmunología y el sistema inmunitario 2024
Tema 19. Inmunología y el sistema inmunitario 2024Tema 19. Inmunología y el sistema inmunitario 2024
Tema 19. Inmunología y el sistema inmunitario 2024
 
Lecciones 06 Esc. Sabática. Los dos testigos
Lecciones 06 Esc. Sabática. Los dos testigosLecciones 06 Esc. Sabática. Los dos testigos
Lecciones 06 Esc. Sabática. Los dos testigos
 
Tema 11. Dinámica de la hidrosfera 2024
Tema 11.  Dinámica de la hidrosfera 2024Tema 11.  Dinámica de la hidrosfera 2024
Tema 11. Dinámica de la hidrosfera 2024
 
Infografía EE con pie del 2023 (3)-1.pdf
Infografía EE con pie del 2023 (3)-1.pdfInfografía EE con pie del 2023 (3)-1.pdf
Infografía EE con pie del 2023 (3)-1.pdf
 
Supuestos_prácticos_funciones.docx
Supuestos_prácticos_funciones.docxSupuestos_prácticos_funciones.docx
Supuestos_prácticos_funciones.docx
 
origen y desarrollo del ensayo literario
origen y desarrollo del ensayo literarioorigen y desarrollo del ensayo literario
origen y desarrollo del ensayo literario
 
Procedimientos para la planificación en los Centros Educativos tipo V ( multi...
Procedimientos para la planificación en los Centros Educativos tipo V ( multi...Procedimientos para la planificación en los Centros Educativos tipo V ( multi...
Procedimientos para la planificación en los Centros Educativos tipo V ( multi...
 

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