SlideShare una empresa de Scribd logo
1 de 25
Apuntes sobre Hojas de Estilo en Cascada (CSS) Mg. Fernando Irigaray Seminario de Integración y Producción
conjunto de instrucciones que indican a un navegador como debe presentar un elemento concreto en una página html. CSS HTML CSS HTML HTML
Características de las CSS ,[object Object],[object Object],[object Object],HTML CSS HTML HTML
Reglas de estilo p {color: #ff0033;}
p {color: #ff0033;} ,[object Object],Reglas de estilo
[object Object],p {color: #ff0033;} Reglas de estilo
Declaración de estilo p {color: #ff0033;} Reglas de estilo
Propiedad p {color: #ff0033;} Reglas de estilo
Separador p {color: #ff0033;} Reglas de estilo
Valor p {color: #ff0033;} Reglas de estilo
h1 { color: #ff0033; font-family: Verdana; font-weight: bold; font-size: 16px; text-align: center; } CSS ,[object Object],Selectores
h1 { color: #ff0033; font-family: Verdana; font-weight: bold; font-size: 16px; text-align: center; } CSS <h1>Título del artículo</h1> HTML ,[object Object],Selectores
[object Object],h1 { color: #ff0033; font-family: Verdana; font-weight: bold; font-size: 16px; text-align: center; } CSS <h1>Título del artículo</h1> HTML Selectores
[object Object],.destacado { font-family: Tahoma; font-size: 11px; font-weight: normal; text-align: left; line-height: 13px; background-color: #EFEFD1; border-width: 1px; border-style: dashed; border-color: #a06000; padding: 10px 10px 10px 10px; } CSS Selectores
[object Object],.destacado { font-family: Tahoma; font-size: 11px; font-weight: normal; text-align: left; line-height: 13px; background-color: #EFEFD1; border-width: 1px; border-style: dashed; border-color: #a06000; padding: 10px 10px 10px 10px; } CSS <div class=&quot;destacado&quot;> <h3 class=&quot;entry-header&quot;> TP Presentación personal en HTML</h3> <br /> <strong>Consigna:</strong> Producir una  presentación personal desarrollada en Código HTML que incluirá:<br /><br /> <a href=&quot;http://www.dialogica.com.ar/digicom/ 2007/04/trabajo_practico_presentacion.php&quot;> Leer texto completo: Consigna del Trabajo Práctico</a> </div> HTML Selectores
#container { width: 714px; background-color: #f1f1f1; } CSS ,[object Object],Selectores
#container { width: 714px; background-color: #f1f1f1; } CSS <body> <div ID=“container”> <h1>Título del artículo</h1> <p>Texto</p> </div> </body> HTML ,[object Object],Selectores
[object Object],#container { width: 714px; background-color: #f1f1f1; } CSS <body> <div ID=“container”> <h1>Título del artículo</h1> <p>Texto</p> </div> </body> HTML Selectores
Estructura Container Nav Banner <body> <div id=“Banner”> xxxxxxxxxxxxxxxx </div> <div id=“Container”> <div class=&quot;destacado&quot;> 1 </div> <div class=&quot;destacado&quot;> 2 </div> <div class=&quot;destacado&quot;> 3 </div> </div> <div id=“Nav”> Xxxxxxxx </div> </body> HTML 1 2 3
Estructura Banner <body> <div id=“Banner”> xxxxxxxxxxxxxxxx </div> <div id=“Container”> <div class=&quot;destacado&quot;> 1 </div> <div class=&quot;destacado&quot;> 2 </div> <div class=&quot;destacado&quot;> 3 </div> </div> <div id=“Nav”> Xxxxxxxx </div> </body> HTML
Estructura Container <body> <div id=“Banner”> xxxxxxxxxxxxxxxx </div> <div id=“Container”> <div class=&quot;destacado&quot;> 1 </div> <div class=&quot;destacado&quot;> 2 </div> <div class=&quot;destacado&quot;> 3 </div> </div> <div id=“Nav”> Xxxxxxxx </div> </body> HTML 1 2 3
Estructura Container <body> <div id=“Banner”> xxxxxxxxxxxxxxxx </div> <div id=“Container”> <div class=&quot;destacado&quot;> 1 </div> <div class=&quot;destacado&quot;> 2 </div> <div class=&quot;destacado&quot;> 3 </div> </div> <div id=“Nav”> Xxxxxxxx </div> </body> HTML 1 2 3 destacado
Estructura Nav <body> <div id=“Banner”> xxxxxxxxxxxxxxxx </div> <div id=“Container”> <div class=&quot;destacado&quot;> 1 </div> <div class=&quot;destacado&quot;> 2 </div> <div class=&quot;destacado&quot;> 3 </div> </div> <div id=“Nav”> Xxxxxxxx </div> </body> HTML
Enlazar archivo CSS <head > <title>Mi página HTML</title> <link rel=“stylesheet” href=“estilos.css” type=&quot;text/css“> </head> HTML HTML CSS HTML HTML
Bibliografía de Consulta ,[object Object],[object Object],[object Object],HTML CSS HTML HTML

Más contenido relacionado

La actualidad más candente

Cuaderno de-ejercicios-y-practicas-php
Cuaderno de-ejercicios-y-practicas-phpCuaderno de-ejercicios-y-practicas-php
Cuaderno de-ejercicios-y-practicas-phplgcj1989
 
Documentación de Proyecto de Software.
Documentación de Proyecto de Software.Documentación de Proyecto de Software.
Documentación de Proyecto de Software.Edgard Ramirez Huaccha
 
Java script(diapositivas)
Java script(diapositivas) Java script(diapositivas)
Java script(diapositivas) Roberto Mejia
 
Ejemplos sobre diagramas de flujo
Ejemplos sobre  diagramas de flujoEjemplos sobre  diagramas de flujo
Ejemplos sobre diagramas de flujoIsaura Nina
 
NGHIÊN CỨU PHƯƠNG PHÁP QUAY LUI VÀ ỨNG DỤNG GIẢI BÀI TOÁN SUDOKU
NGHIÊN CỨU PHƯƠNG PHÁP QUAY LUI VÀ ỨNG DỤNG GIẢI BÀI TOÁN SUDOKU NGHIÊN CỨU PHƯƠNG PHÁP QUAY LUI VÀ ỨNG DỤNG GIẢI BÀI TOÁN SUDOKU
NGHIÊN CỨU PHƯƠNG PHÁP QUAY LUI VÀ ỨNG DỤNG GIẢI BÀI TOÁN SUDOKU nataliej4
 
Clasificación de las estructuras de datos.pptx
Clasificación de las estructuras de datos.pptxClasificación de las estructuras de datos.pptx
Clasificación de las estructuras de datos.pptxRam Vazquez
 
Scrum master responsabilidades x proceso y fase
Scrum master   responsabilidades x proceso y faseScrum master   responsabilidades x proceso y fase
Scrum master responsabilidades x proceso y faseOpen Source Pyme
 
Comparação de desempenho entre SQL e NoSQL
Comparação de desempenho entre SQL e NoSQLComparação de desempenho entre SQL e NoSQL
Comparação de desempenho entre SQL e NoSQLpichiliani
 
73772273 inga-galvez-ejercicios-de-simulacion-de-sistemas
73772273 inga-galvez-ejercicios-de-simulacion-de-sistemas73772273 inga-galvez-ejercicios-de-simulacion-de-sistemas
73772273 inga-galvez-ejercicios-de-simulacion-de-sistemasdantesilva
 
Tópicos Avanzados de Programación - Unidad 2 componentes y librerias
Tópicos Avanzados de Programación - Unidad 2 componentes y libreriasTópicos Avanzados de Programación - Unidad 2 componentes y librerias
Tópicos Avanzados de Programación - Unidad 2 componentes y libreriasJosé Antonio Sandoval Acosta
 
Calidad de Software
Calidad de SoftwareCalidad de Software
Calidad de SoftwareAnaMelba MH
 
Fases de programacion
Fases de programacionFases de programacion
Fases de programacionbrayan_2012
 
Cu00161 a ejercicios resueltos diagramas flujo bucles for next while do (1)
Cu00161 a ejercicios resueltos diagramas flujo bucles for next while do (1)Cu00161 a ejercicios resueltos diagramas flujo bucles for next while do (1)
Cu00161 a ejercicios resueltos diagramas flujo bucles for next while do (1)Henry Apv
 

La actualidad más candente (20)

Msf
MsfMsf
Msf
 
Cuaderno de-ejercicios-y-practicas-php
Cuaderno de-ejercicios-y-practicas-phpCuaderno de-ejercicios-y-practicas-php
Cuaderno de-ejercicios-y-practicas-php
 
Documentación de Proyecto de Software.
Documentación de Proyecto de Software.Documentación de Proyecto de Software.
Documentación de Proyecto de Software.
 
Programación dinámica
Programación dinámicaProgramación dinámica
Programación dinámica
 
Java script(diapositivas)
Java script(diapositivas) Java script(diapositivas)
Java script(diapositivas)
 
Nucleo so
Nucleo soNucleo so
Nucleo so
 
Ejemplos sobre diagramas de flujo
Ejemplos sobre  diagramas de flujoEjemplos sobre  diagramas de flujo
Ejemplos sobre diagramas de flujo
 
NGHIÊN CỨU PHƯƠNG PHÁP QUAY LUI VÀ ỨNG DỤNG GIẢI BÀI TOÁN SUDOKU
NGHIÊN CỨU PHƯƠNG PHÁP QUAY LUI VÀ ỨNG DỤNG GIẢI BÀI TOÁN SUDOKU NGHIÊN CỨU PHƯƠNG PHÁP QUAY LUI VÀ ỨNG DỤNG GIẢI BÀI TOÁN SUDOKU
NGHIÊN CỨU PHƯƠNG PHÁP QUAY LUI VÀ ỨNG DỤNG GIẢI BÀI TOÁN SUDOKU
 
Estimacion de costos del Software
Estimacion de costos del SoftwareEstimacion de costos del Software
Estimacion de costos del Software
 
Clasificación de las estructuras de datos.pptx
Clasificación de las estructuras de datos.pptxClasificación de las estructuras de datos.pptx
Clasificación de las estructuras de datos.pptx
 
Tolerancia..
Tolerancia..Tolerancia..
Tolerancia..
 
Scrum master responsabilidades x proceso y fase
Scrum master   responsabilidades x proceso y faseScrum master   responsabilidades x proceso y fase
Scrum master responsabilidades x proceso y fase
 
Simulacion con Software ARENA
Simulacion con Software ARENASimulacion con Software ARENA
Simulacion con Software ARENA
 
Comparação de desempenho entre SQL e NoSQL
Comparação de desempenho entre SQL e NoSQLComparação de desempenho entre SQL e NoSQL
Comparação de desempenho entre SQL e NoSQL
 
73772273 inga-galvez-ejercicios-de-simulacion-de-sistemas
73772273 inga-galvez-ejercicios-de-simulacion-de-sistemas73772273 inga-galvez-ejercicios-de-simulacion-de-sistemas
73772273 inga-galvez-ejercicios-de-simulacion-de-sistemas
 
Modelos dinamicos Orientado a Objetos
Modelos dinamicos Orientado a ObjetosModelos dinamicos Orientado a Objetos
Modelos dinamicos Orientado a Objetos
 
Tópicos Avanzados de Programación - Unidad 2 componentes y librerias
Tópicos Avanzados de Programación - Unidad 2 componentes y libreriasTópicos Avanzados de Programación - Unidad 2 componentes y librerias
Tópicos Avanzados de Programación - Unidad 2 componentes y librerias
 
Calidad de Software
Calidad de SoftwareCalidad de Software
Calidad de Software
 
Fases de programacion
Fases de programacionFases de programacion
Fases de programacion
 
Cu00161 a ejercicios resueltos diagramas flujo bucles for next while do (1)
Cu00161 a ejercicios resueltos diagramas flujo bucles for next while do (1)Cu00161 a ejercicios resueltos diagramas flujo bucles for next while do (1)
Cu00161 a ejercicios resueltos diagramas flujo bucles for next while do (1)
 

Similar a Hojas de Estilos en Cascada (CSS) - Apuntes

Similar a Hojas de Estilos en Cascada (CSS) - Apuntes (20)

rosario
rosariorosario
rosario
 
Taller multimedia
Taller multimediaTaller multimedia
Taller multimedia
 
ccs
ccsccs
ccs
 
CSS
CSSCSS
CSS
 
Diseño web con css
Diseño web con cssDiseño web con css
Diseño web con css
 
Hojas de estilo css
Hojas de estilo cssHojas de estilo css
Hojas de estilo css
 
Hojas de estilo_css
Hojas de estilo_cssHojas de estilo_css
Hojas de estilo_css
 
Hojas de estilo css
Hojas de estilo cssHojas de estilo css
Hojas de estilo css
 
Hojas De Estilo Css
Hojas De Estilo CssHojas De Estilo Css
Hojas De Estilo Css
 
Diseño de páginas Web con HTML
Diseño de páginas Web con HTMLDiseño de páginas Web con HTML
Diseño de páginas Web con HTML
 
CSS
CSSCSS
CSS
 
Hojas de estilo css
Hojas de estilo cssHojas de estilo css
Hojas de estilo css
 
Dhtml
DhtmlDhtml
Dhtml
 
XHTML+Inicio en CSS
XHTML+Inicio en CSSXHTML+Inicio en CSS
XHTML+Inicio en CSS
 
CSS - ¿Cómo agregar estilos a mi página?
CSS - ¿Cómo agregar estilos a mi página?CSS - ¿Cómo agregar estilos a mi página?
CSS - ¿Cómo agregar estilos a mi página?
 
CSS
CSSCSS
CSS
 
Html y css
Html y cssHtml y css
Html y css
 
Curso FPE Diseño Web. Módulo 2. El HTML
Curso FPE Diseño Web. Módulo 2. El HTMLCurso FPE Diseño Web. Módulo 2. El HTML
Curso FPE Diseño Web. Módulo 2. El HTML
 
Html
HtmlHtml
Html
 
Html
HtmlHtml
Html
 

Más de Fernando Irigaray

3. Aplicaciones: webdocs y videos interactivos
3. Aplicaciones: webdocs y videos interactivos3. Aplicaciones: webdocs y videos interactivos
3. Aplicaciones: webdocs y videos interactivosFernando Irigaray
 
1. Principios y dimensiones de una producción digital interactiva
1. Principios y dimensiones de una producción digital interactiva1. Principios y dimensiones de una producción digital interactiva
1. Principios y dimensiones de una producción digital interactivaFernando Irigaray
 
Jornalismo Transmídia desde a periferia
Jornalismo Transmídia desde a periferiaJornalismo Transmídia desde a periferia
Jornalismo Transmídia desde a periferiaFernando Irigaray
 
Del documental multimedia al documental Transmedia: Mujeres en venta
Del documental multimedia al documental Transmedia: Mujeres en venta Del documental multimedia al documental Transmedia: Mujeres en venta
Del documental multimedia al documental Transmedia: Mujeres en venta Fernando Irigaray
 
Navegación Territorial: Entramado Narrativo Urbana. Tras los pasos de El Homb...
Navegación Territorial: Entramado Narrativo Urbana. Tras los pasos de El Homb...Navegación Territorial: Entramado Narrativo Urbana. Tras los pasos de El Homb...
Navegación Territorial: Entramado Narrativo Urbana. Tras los pasos de El Homb...Fernando Irigaray
 
Twitter: aplicaciones y usos III
Twitter: aplicaciones y usos IIITwitter: aplicaciones y usos III
Twitter: aplicaciones y usos IIIFernando Irigaray
 
Twitter: aplicaciones y usos II
Twitter: aplicaciones y usos IITwitter: aplicaciones y usos II
Twitter: aplicaciones y usos IIFernando Irigaray
 
Twitter: aplicaciones y usos I
Twitter: aplicaciones y usos ITwitter: aplicaciones y usos I
Twitter: aplicaciones y usos IFernando Irigaray
 
1. De la web 2.0 a la web 2.1
1. De la web 2.0 a la web 2.11. De la web 2.0 a la web 2.1
1. De la web 2.0 a la web 2.1Fernando Irigaray
 
1. De la web 2.0 a la web 2.1
1. De la web 2.0 a la web 2.11. De la web 2.0 a la web 2.1
1. De la web 2.0 a la web 2.1Fernando Irigaray
 
2 . Web 2.0: Del usuario consumidor al usuario productor
2 . Web 2.0:Del usuario consumidor al usuario productor2 . Web 2.0:Del usuario consumidor al usuario productor
2 . Web 2.0: Del usuario consumidor al usuario productorFernando Irigaray
 
2 . Web 2.0: Del usuario consumidor al usuario productor
2 . Web 2.0:Del usuario consumidor al usuario productor2 . Web 2.0:Del usuario consumidor al usuario productor
2 . Web 2.0: Del usuario consumidor al usuario productorFernando Irigaray
 
1. Cambios en la formación del ciberperiodismo
1. Cambios en la formación del ciberperiodismo1. Cambios en la formación del ciberperiodismo
1. Cambios en la formación del ciberperiodismoFernando Irigaray
 
1 - Modelos de Comunicación y Modelos de Educación
1 - Modelos de Comunicación y Modelos de Educación1 - Modelos de Comunicación y Modelos de Educación
1 - Modelos de Comunicación y Modelos de EducaciónFernando Irigaray
 

Más de Fernando Irigaray (20)

3. Aplicaciones: webdocs y videos interactivos
3. Aplicaciones: webdocs y videos interactivos3. Aplicaciones: webdocs y videos interactivos
3. Aplicaciones: webdocs y videos interactivos
 
2. Periodismo Transmedia
2. Periodismo Transmedia2. Periodismo Transmedia
2. Periodismo Transmedia
 
1. Principios y dimensiones de una producción digital interactiva
1. Principios y dimensiones de una producción digital interactiva1. Principios y dimensiones de una producción digital interactiva
1. Principios y dimensiones de una producción digital interactiva
 
Jornalismo Transmídia desde a periferia
Jornalismo Transmídia desde a periferiaJornalismo Transmídia desde a periferia
Jornalismo Transmídia desde a periferia
 
Del documental multimedia al documental Transmedia: Mujeres en venta
Del documental multimedia al documental Transmedia: Mujeres en venta Del documental multimedia al documental Transmedia: Mujeres en venta
Del documental multimedia al documental Transmedia: Mujeres en venta
 
Navegación Territorial: Entramado Narrativo Urbana. Tras los pasos de El Homb...
Navegación Territorial: Entramado Narrativo Urbana. Tras los pasos de El Homb...Navegación Territorial: Entramado Narrativo Urbana. Tras los pasos de El Homb...
Navegación Territorial: Entramado Narrativo Urbana. Tras los pasos de El Homb...
 
Imagen Digital
Imagen DigitalImagen Digital
Imagen Digital
 
Community manager
Community managerCommunity manager
Community manager
 
Twitter: aplicaciones y usos III
Twitter: aplicaciones y usos IIITwitter: aplicaciones y usos III
Twitter: aplicaciones y usos III
 
Twitter: aplicaciones y usos II
Twitter: aplicaciones y usos IITwitter: aplicaciones y usos II
Twitter: aplicaciones y usos II
 
Twitter: aplicaciones y usos I
Twitter: aplicaciones y usos ITwitter: aplicaciones y usos I
Twitter: aplicaciones y usos I
 
1. De la web 2.0 a la web 2.1
1. De la web 2.0 a la web 2.11. De la web 2.0 a la web 2.1
1. De la web 2.0 a la web 2.1
 
Diseño Multimedial
Diseño MultimedialDiseño Multimedial
Diseño Multimedial
 
2. Imagen Digital
2. Imagen Digital2. Imagen Digital
2. Imagen Digital
 
1. De la web 2.0 a la web 2.1
1. De la web 2.0 a la web 2.11. De la web 2.0 a la web 2.1
1. De la web 2.0 a la web 2.1
 
2 . Web 2.0: Del usuario consumidor al usuario productor
2 . Web 2.0:Del usuario consumidor al usuario productor2 . Web 2.0:Del usuario consumidor al usuario productor
2 . Web 2.0: Del usuario consumidor al usuario productor
 
2 . Web 2.0: Del usuario consumidor al usuario productor
2 . Web 2.0:Del usuario consumidor al usuario productor2 . Web 2.0:Del usuario consumidor al usuario productor
2 . Web 2.0: Del usuario consumidor al usuario productor
 
Convergencia de medios
Convergencia de mediosConvergencia de medios
Convergencia de medios
 
1. Cambios en la formación del ciberperiodismo
1. Cambios en la formación del ciberperiodismo1. Cambios en la formación del ciberperiodismo
1. Cambios en la formación del ciberperiodismo
 
1 - Modelos de Comunicación y Modelos de Educación
1 - Modelos de Comunicación y Modelos de Educación1 - Modelos de Comunicación y Modelos de Educación
1 - Modelos de Comunicación y Modelos de Educación
 

Último

guía de registro de slideshare por Brayan Joseph
guía de registro de slideshare por Brayan Josephguía de registro de slideshare por Brayan Joseph
guía de registro de slideshare por Brayan JosephBRAYANJOSEPHPEREZGOM
 
Desarrollo Web Moderno con Svelte 2024.pdf
Desarrollo Web Moderno con Svelte 2024.pdfDesarrollo Web Moderno con Svelte 2024.pdf
Desarrollo Web Moderno con Svelte 2024.pdfJulian Lamprea
 
Avances tecnológicos del siglo XXI y ejemplos de estos
Avances tecnológicos del siglo XXI y ejemplos de estosAvances tecnológicos del siglo XXI y ejemplos de estos
Avances tecnológicos del siglo XXI y ejemplos de estossgonzalezp1
 
Trabajo Mas Completo De Excel en clase tecnología
Trabajo Mas Completo De Excel en clase tecnologíaTrabajo Mas Completo De Excel en clase tecnología
Trabajo Mas Completo De Excel en clase tecnologíassuserf18419
 
PROYECTO FINAL. Tutorial para publicar en SlideShare.pptx
PROYECTO FINAL. Tutorial para publicar en SlideShare.pptxPROYECTO FINAL. Tutorial para publicar en SlideShare.pptx
PROYECTO FINAL. Tutorial para publicar en SlideShare.pptxAlan779941
 
EL CICLO PRÁCTICO DE UN MOTOR DE CUATRO TIEMPOS.pptx
EL CICLO PRÁCTICO DE UN MOTOR DE CUATRO TIEMPOS.pptxEL CICLO PRÁCTICO DE UN MOTOR DE CUATRO TIEMPOS.pptx
EL CICLO PRÁCTICO DE UN MOTOR DE CUATRO TIEMPOS.pptxMiguelAtencio10
 
Presentación guía sencilla en Microsoft Excel.pptx
Presentación guía sencilla en Microsoft Excel.pptxPresentación guía sencilla en Microsoft Excel.pptx
Presentación guía sencilla en Microsoft Excel.pptxLolaBunny11
 
EPA-pdf resultado da prova presencial Uninove
EPA-pdf resultado da prova presencial UninoveEPA-pdf resultado da prova presencial Uninove
EPA-pdf resultado da prova presencial UninoveFagnerLisboa3
 
pruebas unitarias unitarias en java con JUNIT
pruebas unitarias unitarias en java con JUNITpruebas unitarias unitarias en java con JUNIT
pruebas unitarias unitarias en java con JUNITMaricarmen Sánchez Ruiz
 
Avances tecnológicos del siglo XXI 10-07 eyvana
Avances tecnológicos del siglo XXI 10-07 eyvanaAvances tecnológicos del siglo XXI 10-07 eyvana
Avances tecnológicos del siglo XXI 10-07 eyvanamcerpam
 
Modulo-Mini Cargador.................pdf
Modulo-Mini Cargador.................pdfModulo-Mini Cargador.................pdf
Modulo-Mini Cargador.................pdfAnnimoUno1
 
presentacion de PowerPoint de la fuente de poder.pptx
presentacion de PowerPoint de la fuente de poder.pptxpresentacion de PowerPoint de la fuente de poder.pptx
presentacion de PowerPoint de la fuente de poder.pptxlosdiosesmanzaneros
 
Global Azure Lima 2024 - Integración de Datos con Microsoft Fabric
Global Azure Lima 2024 - Integración de Datos con Microsoft FabricGlobal Azure Lima 2024 - Integración de Datos con Microsoft Fabric
Global Azure Lima 2024 - Integración de Datos con Microsoft FabricKeyla Dolores Méndez
 
Presentación de elementos de afilado con esmeril
Presentación de elementos de afilado con esmerilPresentación de elementos de afilado con esmeril
Presentación de elementos de afilado con esmerilJuanGallardo438714
 
Refrigerador_Inverter_Samsung_Curso_y_Manual_de_Servicio_Español.pdf
Refrigerador_Inverter_Samsung_Curso_y_Manual_de_Servicio_Español.pdfRefrigerador_Inverter_Samsung_Curso_y_Manual_de_Servicio_Español.pdf
Refrigerador_Inverter_Samsung_Curso_y_Manual_de_Servicio_Español.pdfvladimiroflores1
 

Último (15)

guía de registro de slideshare por Brayan Joseph
guía de registro de slideshare por Brayan Josephguía de registro de slideshare por Brayan Joseph
guía de registro de slideshare por Brayan Joseph
 
Desarrollo Web Moderno con Svelte 2024.pdf
Desarrollo Web Moderno con Svelte 2024.pdfDesarrollo Web Moderno con Svelte 2024.pdf
Desarrollo Web Moderno con Svelte 2024.pdf
 
Avances tecnológicos del siglo XXI y ejemplos de estos
Avances tecnológicos del siglo XXI y ejemplos de estosAvances tecnológicos del siglo XXI y ejemplos de estos
Avances tecnológicos del siglo XXI y ejemplos de estos
 
Trabajo Mas Completo De Excel en clase tecnología
Trabajo Mas Completo De Excel en clase tecnologíaTrabajo Mas Completo De Excel en clase tecnología
Trabajo Mas Completo De Excel en clase tecnología
 
PROYECTO FINAL. Tutorial para publicar en SlideShare.pptx
PROYECTO FINAL. Tutorial para publicar en SlideShare.pptxPROYECTO FINAL. Tutorial para publicar en SlideShare.pptx
PROYECTO FINAL. Tutorial para publicar en SlideShare.pptx
 
EL CICLO PRÁCTICO DE UN MOTOR DE CUATRO TIEMPOS.pptx
EL CICLO PRÁCTICO DE UN MOTOR DE CUATRO TIEMPOS.pptxEL CICLO PRÁCTICO DE UN MOTOR DE CUATRO TIEMPOS.pptx
EL CICLO PRÁCTICO DE UN MOTOR DE CUATRO TIEMPOS.pptx
 
Presentación guía sencilla en Microsoft Excel.pptx
Presentación guía sencilla en Microsoft Excel.pptxPresentación guía sencilla en Microsoft Excel.pptx
Presentación guía sencilla en Microsoft Excel.pptx
 
EPA-pdf resultado da prova presencial Uninove
EPA-pdf resultado da prova presencial UninoveEPA-pdf resultado da prova presencial Uninove
EPA-pdf resultado da prova presencial Uninove
 
pruebas unitarias unitarias en java con JUNIT
pruebas unitarias unitarias en java con JUNITpruebas unitarias unitarias en java con JUNIT
pruebas unitarias unitarias en java con JUNIT
 
Avances tecnológicos del siglo XXI 10-07 eyvana
Avances tecnológicos del siglo XXI 10-07 eyvanaAvances tecnológicos del siglo XXI 10-07 eyvana
Avances tecnológicos del siglo XXI 10-07 eyvana
 
Modulo-Mini Cargador.................pdf
Modulo-Mini Cargador.................pdfModulo-Mini Cargador.................pdf
Modulo-Mini Cargador.................pdf
 
presentacion de PowerPoint de la fuente de poder.pptx
presentacion de PowerPoint de la fuente de poder.pptxpresentacion de PowerPoint de la fuente de poder.pptx
presentacion de PowerPoint de la fuente de poder.pptx
 
Global Azure Lima 2024 - Integración de Datos con Microsoft Fabric
Global Azure Lima 2024 - Integración de Datos con Microsoft FabricGlobal Azure Lima 2024 - Integración de Datos con Microsoft Fabric
Global Azure Lima 2024 - Integración de Datos con Microsoft Fabric
 
Presentación de elementos de afilado con esmeril
Presentación de elementos de afilado con esmerilPresentación de elementos de afilado con esmeril
Presentación de elementos de afilado con esmeril
 
Refrigerador_Inverter_Samsung_Curso_y_Manual_de_Servicio_Español.pdf
Refrigerador_Inverter_Samsung_Curso_y_Manual_de_Servicio_Español.pdfRefrigerador_Inverter_Samsung_Curso_y_Manual_de_Servicio_Español.pdf
Refrigerador_Inverter_Samsung_Curso_y_Manual_de_Servicio_Español.pdf
 

Hojas de Estilos en Cascada (CSS) - Apuntes

  • 1. Apuntes sobre Hojas de Estilo en Cascada (CSS) Mg. Fernando Irigaray Seminario de Integración y Producción
  • 2. conjunto de instrucciones que indican a un navegador como debe presentar un elemento concreto en una página html. CSS HTML CSS HTML HTML
  • 3.
  • 4. Reglas de estilo p {color: #ff0033;}
  • 5.
  • 6.
  • 7. Declaración de estilo p {color: #ff0033;} Reglas de estilo
  • 8. Propiedad p {color: #ff0033;} Reglas de estilo
  • 9. Separador p {color: #ff0033;} Reglas de estilo
  • 10. Valor p {color: #ff0033;} Reglas de estilo
  • 11.
  • 12.
  • 13.
  • 14.
  • 15.
  • 16.
  • 17.
  • 18.
  • 19. Estructura Container Nav Banner <body> <div id=“Banner”> xxxxxxxxxxxxxxxx </div> <div id=“Container”> <div class=&quot;destacado&quot;> 1 </div> <div class=&quot;destacado&quot;> 2 </div> <div class=&quot;destacado&quot;> 3 </div> </div> <div id=“Nav”> Xxxxxxxx </div> </body> HTML 1 2 3
  • 20. Estructura Banner <body> <div id=“Banner”> xxxxxxxxxxxxxxxx </div> <div id=“Container”> <div class=&quot;destacado&quot;> 1 </div> <div class=&quot;destacado&quot;> 2 </div> <div class=&quot;destacado&quot;> 3 </div> </div> <div id=“Nav”> Xxxxxxxx </div> </body> HTML
  • 21. Estructura Container <body> <div id=“Banner”> xxxxxxxxxxxxxxxx </div> <div id=“Container”> <div class=&quot;destacado&quot;> 1 </div> <div class=&quot;destacado&quot;> 2 </div> <div class=&quot;destacado&quot;> 3 </div> </div> <div id=“Nav”> Xxxxxxxx </div> </body> HTML 1 2 3
  • 22. Estructura Container <body> <div id=“Banner”> xxxxxxxxxxxxxxxx </div> <div id=“Container”> <div class=&quot;destacado&quot;> 1 </div> <div class=&quot;destacado&quot;> 2 </div> <div class=&quot;destacado&quot;> 3 </div> </div> <div id=“Nav”> Xxxxxxxx </div> </body> HTML 1 2 3 destacado
  • 23. Estructura Nav <body> <div id=“Banner”> xxxxxxxxxxxxxxxx </div> <div id=“Container”> <div class=&quot;destacado&quot;> 1 </div> <div class=&quot;destacado&quot;> 2 </div> <div class=&quot;destacado&quot;> 3 </div> </div> <div id=“Nav”> Xxxxxxxx </div> </body> HTML
  • 24. Enlazar archivo CSS <head > <title>Mi página HTML</title> <link rel=“stylesheet” href=“estilos.css” type=&quot;text/css“> </head> HTML HTML CSS HTML HTML
  • 25.