SlideShare una empresa de Scribd logo
1 de 8
III BTP EN
INFORMATICA
CSS EN HTML5
QUÉ ES CSS
•Las hojas de estilo en cascada o
(Cascading Style Sheets, o sus siglas CSS)
hacen referencia a un lenguaje de hojas
de estilos usado para describir la
presentación semántica (el aspecto y
formato) de un documento escrito en
lenguaje de marcas.
SINTAXIS CSS
•Estilo CSS tiene la siguiente sintaxis:
•element { property:value; property:value }
•El elemento es un nombre de elemento
HTML. La propiedad es una propiedad
CSS. El valor es un valor CSS.
•Estilos múltiples se separan con punto y coma.
NORMA PARA INCLUIR NUESTRO
CSS
•el lenguaje HTML incluye una etiqueta, sin
embargo ni es la única forma de incluirlo ni
existe una única implementación de esta
etiqueta.
EL ESTILO DE HTML CON CSS
CSS significa C ascading S tyle S heets
Styling se puede añadir a los elementos HTML
de 3 formas:
•Inline - utilizando un atributo de estilo en los
elementos HTML
•Interno - utilizando un elemento <style> en
el HTML <head>
HTML5
•(HyperText Markup Language, versión 5)
es la quinta revisión importante del lenguaje
básico de la World Wide web, HtMl HTML5
especifica dos variantes de sintaxis para HTML:
un «clásico» HTML (text/html),la variante
conocida como html5 y una variante xhtml
conosida como sintaxis que deberá ser servida
como xml es la primer vez que se desarrolla en
CÓMO CREAR MI PRIMERA PÁGINA
EN HTML5 Y CSS
con WebMatrix 2, algunas de las novedades en
etiquetas y atributos de estos estándares y
las ventajas que nos ofrece WebMatrix 2 para
esta tarea Con HTML5 tendremos una web más
simple y semántica gracias a las nuevas
etiquetas para identificar mejor algunos
elementos y cuando la selecciones te pondrá
la etiqueta de cierre automáticamente para que
CSS EN HTML5

Más contenido relacionado

La actualidad más candente (19)

Hojas de Estilo CSS
Hojas de Estilo CSSHojas de Estilo CSS
Hojas de Estilo CSS
 
Que es css
Que es cssQue es css
Que es css
 
Css básico
Css básicoCss básico
Css básico
 
Hablando de css
Hablando de cssHablando de css
Hablando de css
 
Hojas estilo
Hojas estiloHojas estilo
Hojas estilo
 
CSS - Hojas de Estilo en Cascada
CSS - Hojas de Estilo en CascadaCSS - Hojas de Estilo en Cascada
CSS - Hojas de Estilo en Cascada
 
Html5+css3 02
Html5+css3 02Html5+css3 02
Html5+css3 02
 
Hojas de calculo CSS
Hojas de calculo CSSHojas de calculo CSS
Hojas de calculo CSS
 
Css Introducción
Css IntroducciónCss Introducción
Css Introducción
 
Introducción a CSS
Introducción a CSSIntroducción a CSS
Introducción a CSS
 
Manual de Introducción a los Css
Manual de Introducción a los Css Manual de Introducción a los Css
Manual de Introducción a los Css
 
HTML5+CSS3 01
HTML5+CSS3 01HTML5+CSS3 01
HTML5+CSS3 01
 
Css
CssCss
Css
 
Estilos cascadas
Estilos cascadasEstilos cascadas
Estilos cascadas
 
CSS3
CSS3CSS3
CSS3
 
Instrucciones html
Instrucciones htmlInstrucciones html
Instrucciones html
 
Css
CssCss
Css
 
06 Introduccion a CSS
06 Introduccion a CSS06 Introduccion a CSS
06 Introduccion a CSS
 
Hojas de estilo
Hojas de estiloHojas de estilo
Hojas de estilo
 

Destacado

Destacado (9)

Estilos css
Estilos cssEstilos css
Estilos css
 
Blogger
BloggerBlogger
Blogger
 
Uso educativo del computador
Uso educativo del computadorUso educativo del computador
Uso educativo del computador
 
Fiolosofia cristiana medieval
Fiolosofia cristiana medievalFiolosofia cristiana medieval
Fiolosofia cristiana medieval
 
Introducción a html5
Introducción a html5Introducción a html5
Introducción a html5
 
Estilos css
Estilos cssEstilos css
Estilos css
 
Selectores css
Selectores cssSelectores css
Selectores css
 
Estructuras de control en js
Estructuras de control en jsEstructuras de control en js
Estructuras de control en js
 
Introducción a css
Introducción a cssIntroducción a css
Introducción a css
 

Similar a CSS EN HTML5

Similar a CSS EN HTML5 (20)

Diseño y desarrollo web: Introducción al lenguaje CSS IIQ.pptx
Diseño y desarrollo web: Introducción al lenguaje CSS IIQ.pptxDiseño y desarrollo web: Introducción al lenguaje CSS IIQ.pptx
Diseño y desarrollo web: Introducción al lenguaje CSS IIQ.pptx
 
CSS estilos.pptx
CSS estilos.pptxCSS estilos.pptx
CSS estilos.pptx
 
Qué es css
Qué es cssQué es css
Qué es css
 
1. Introducción a las Hojas de estilo (CSS)
1. Introducción a las Hojas de estilo (CSS)1. Introducción a las Hojas de estilo (CSS)
1. Introducción a las Hojas de estilo (CSS)
 
Curso css
Curso   cssCurso   css
Curso css
 
Identificación del lenguaje de css
Identificación del lenguaje de cssIdentificación del lenguaje de css
Identificación del lenguaje de css
 
Lenguaje html
Lenguaje htmlLenguaje html
Lenguaje html
 
Identificación del lenguaje css
Identificación del lenguaje cssIdentificación del lenguaje css
Identificación del lenguaje css
 
Presentación Introducción al lenguaje HTML
Presentación Introducción al lenguaje HTMLPresentación Introducción al lenguaje HTML
Presentación Introducción al lenguaje HTML
 
Lenguaje html y css
Lenguaje html y cssLenguaje html y css
Lenguaje html y css
 
Lenguaje html y css
Lenguaje html y cssLenguaje html y css
Lenguaje html y css
 
Identificacion del lenguaje css
Identificacion del lenguaje cssIdentificacion del lenguaje css
Identificacion del lenguaje css
 
Presenpabo
PresenpaboPresenpabo
Presenpabo
 
Lenguaje HTML y CSS
Lenguaje HTML y CSSLenguaje HTML y CSS
Lenguaje HTML y CSS
 
¿Qué es el lenguaje HTML?
¿Qué es el lenguaje HTML?¿Qué es el lenguaje HTML?
¿Qué es el lenguaje HTML?
 
Diseño web con css
Diseño web con cssDiseño web con css
Diseño web con css
 
Qué es CSS y con qué se come?
Qué es CSS y con qué se come?Qué es CSS y con qué se come?
Qué es CSS y con qué se come?
 
HTML y CSS
HTML y CSSHTML y CSS
HTML y CSS
 
Presentación
PresentaciónPresentación
Presentación
 
Html
HtmlHtml
Html
 

Último

PRIMARIA 1. RESUELVE PROBLEMAS DE FORMA MOVIMIENTO Y LOCALIZACIÓN 2 (2).pptx
PRIMARIA 1. RESUELVE PROBLEMAS DE FORMA MOVIMIENTO Y LOCALIZACIÓN 2 (2).pptxPRIMARIA 1. RESUELVE PROBLEMAS DE FORMA MOVIMIENTO Y LOCALIZACIÓN 2 (2).pptx
PRIMARIA 1. RESUELVE PROBLEMAS DE FORMA MOVIMIENTO Y LOCALIZACIÓN 2 (2).pptxRodriguezLucero
 
Institucion educativa la esperanza sede la magdalena
Institucion educativa la esperanza sede la magdalenaInstitucion educativa la esperanza sede la magdalena
Institucion educativa la esperanza sede la magdalenadanielaerazok
 
NUVO PROGRAMAS DE ESCUELAS NUEVO-ACUERDO-CTE.pdf
NUVO PROGRAMAS DE ESCUELAS NUEVO-ACUERDO-CTE.pdfNUVO PROGRAMAS DE ESCUELAS NUEVO-ACUERDO-CTE.pdf
NUVO PROGRAMAS DE ESCUELAS NUEVO-ACUERDO-CTE.pdfisrael garcia
 
libro de Ciencias Sociales_6to grado.pdf
libro de Ciencias Sociales_6to grado.pdflibro de Ciencias Sociales_6to grado.pdf
libro de Ciencias Sociales_6to grado.pdfFAUSTODANILOCRUZCAST
 
2º SOY LECTOR PART 2- MD EDUCATIVO (6).pdf
2º SOY LECTOR PART 2- MD  EDUCATIVO (6).pdf2º SOY LECTOR PART 2- MD  EDUCATIVO (6).pdf
2º SOY LECTOR PART 2- MD EDUCATIVO (6).pdfFernandaHernandez312615
 
INSTITUCION EDUCATIVA LA ESPERANZA SEDE MAGDALENA
INSTITUCION EDUCATIVA LA ESPERANZA SEDE MAGDALENAINSTITUCION EDUCATIVA LA ESPERANZA SEDE MAGDALENA
INSTITUCION EDUCATIVA LA ESPERANZA SEDE MAGDALENAdanielaerazok
 
rodriguez_DelAngel_MariaGPE_M1S3AL6.pptx
rodriguez_DelAngel_MariaGPE_M1S3AL6.pptxrodriguez_DelAngel_MariaGPE_M1S3AL6.pptx
rodriguez_DelAngel_MariaGPE_M1S3AL6.pptxssuser61dda7
 
Historia de la Medicina y bases para desarrollo de ella
Historia de la Medicina y bases para desarrollo de ellaHistoria de la Medicina y bases para desarrollo de ella
Historia de la Medicina y bases para desarrollo de ellajuancamilo3111391
 
MODELO CARACTERIZACION DE PROCESOS SENA.
MODELO CARACTERIZACION DE PROCESOS SENA.MODELO CARACTERIZACION DE PROCESOS SENA.
MODELO CARACTERIZACION DE PROCESOS SENA.imejia2411
 
institucion educativa la esperanza sede magdalena
institucion educativa la esperanza sede magdalenainstitucion educativa la esperanza sede magdalena
institucion educativa la esperanza sede magdalenajuniorcuellargomez
 
Buscadores, SEM SEO: el desafío de ser visto en la web
Buscadores, SEM SEO: el desafío de ser visto en la webBuscadores, SEM SEO: el desafío de ser visto en la web
Buscadores, SEM SEO: el desafío de ser visto en la webDecaunlz
 
actividad.06_crea_un_recurso_multimedia_M01_S03_M01.ppsx
actividad.06_crea_un_recurso_multimedia_M01_S03_M01.ppsxactividad.06_crea_un_recurso_multimedia_M01_S03_M01.ppsx
actividad.06_crea_un_recurso_multimedia_M01_S03_M01.ppsx241532171
 
COMPETENCIAS CIUDADANASadadadadadadada .pdf
COMPETENCIAS CIUDADANASadadadadadadada .pdfCOMPETENCIAS CIUDADANASadadadadadadada .pdf
COMPETENCIAS CIUDADANASadadadadadadada .pdfOscarBlas6
 

Último (13)

PRIMARIA 1. RESUELVE PROBLEMAS DE FORMA MOVIMIENTO Y LOCALIZACIÓN 2 (2).pptx
PRIMARIA 1. RESUELVE PROBLEMAS DE FORMA MOVIMIENTO Y LOCALIZACIÓN 2 (2).pptxPRIMARIA 1. RESUELVE PROBLEMAS DE FORMA MOVIMIENTO Y LOCALIZACIÓN 2 (2).pptx
PRIMARIA 1. RESUELVE PROBLEMAS DE FORMA MOVIMIENTO Y LOCALIZACIÓN 2 (2).pptx
 
Institucion educativa la esperanza sede la magdalena
Institucion educativa la esperanza sede la magdalenaInstitucion educativa la esperanza sede la magdalena
Institucion educativa la esperanza sede la magdalena
 
NUVO PROGRAMAS DE ESCUELAS NUEVO-ACUERDO-CTE.pdf
NUVO PROGRAMAS DE ESCUELAS NUEVO-ACUERDO-CTE.pdfNUVO PROGRAMAS DE ESCUELAS NUEVO-ACUERDO-CTE.pdf
NUVO PROGRAMAS DE ESCUELAS NUEVO-ACUERDO-CTE.pdf
 
libro de Ciencias Sociales_6to grado.pdf
libro de Ciencias Sociales_6to grado.pdflibro de Ciencias Sociales_6to grado.pdf
libro de Ciencias Sociales_6to grado.pdf
 
2º SOY LECTOR PART 2- MD EDUCATIVO (6).pdf
2º SOY LECTOR PART 2- MD  EDUCATIVO (6).pdf2º SOY LECTOR PART 2- MD  EDUCATIVO (6).pdf
2º SOY LECTOR PART 2- MD EDUCATIVO (6).pdf
 
INSTITUCION EDUCATIVA LA ESPERANZA SEDE MAGDALENA
INSTITUCION EDUCATIVA LA ESPERANZA SEDE MAGDALENAINSTITUCION EDUCATIVA LA ESPERANZA SEDE MAGDALENA
INSTITUCION EDUCATIVA LA ESPERANZA SEDE MAGDALENA
 
rodriguez_DelAngel_MariaGPE_M1S3AL6.pptx
rodriguez_DelAngel_MariaGPE_M1S3AL6.pptxrodriguez_DelAngel_MariaGPE_M1S3AL6.pptx
rodriguez_DelAngel_MariaGPE_M1S3AL6.pptx
 
Historia de la Medicina y bases para desarrollo de ella
Historia de la Medicina y bases para desarrollo de ellaHistoria de la Medicina y bases para desarrollo de ella
Historia de la Medicina y bases para desarrollo de ella
 
MODELO CARACTERIZACION DE PROCESOS SENA.
MODELO CARACTERIZACION DE PROCESOS SENA.MODELO CARACTERIZACION DE PROCESOS SENA.
MODELO CARACTERIZACION DE PROCESOS SENA.
 
institucion educativa la esperanza sede magdalena
institucion educativa la esperanza sede magdalenainstitucion educativa la esperanza sede magdalena
institucion educativa la esperanza sede magdalena
 
Buscadores, SEM SEO: el desafío de ser visto en la web
Buscadores, SEM SEO: el desafío de ser visto en la webBuscadores, SEM SEO: el desafío de ser visto en la web
Buscadores, SEM SEO: el desafío de ser visto en la web
 
actividad.06_crea_un_recurso_multimedia_M01_S03_M01.ppsx
actividad.06_crea_un_recurso_multimedia_M01_S03_M01.ppsxactividad.06_crea_un_recurso_multimedia_M01_S03_M01.ppsx
actividad.06_crea_un_recurso_multimedia_M01_S03_M01.ppsx
 
COMPETENCIAS CIUDADANASadadadadadadada .pdf
COMPETENCIAS CIUDADANASadadadadadadada .pdfCOMPETENCIAS CIUDADANASadadadadadadada .pdf
COMPETENCIAS CIUDADANASadadadadadadada .pdf
 

CSS EN HTML5

  • 2. QUÉ ES CSS •Las hojas de estilo en cascada o (Cascading Style Sheets, o sus siglas CSS) hacen referencia a un lenguaje de hojas de estilos usado para describir la presentación semántica (el aspecto y formato) de un documento escrito en lenguaje de marcas.
  • 3. SINTAXIS CSS •Estilo CSS tiene la siguiente sintaxis: •element { property:value; property:value } •El elemento es un nombre de elemento HTML. La propiedad es una propiedad CSS. El valor es un valor CSS. •Estilos múltiples se separan con punto y coma.
  • 4. NORMA PARA INCLUIR NUESTRO CSS •el lenguaje HTML incluye una etiqueta, sin embargo ni es la única forma de incluirlo ni existe una única implementación de esta etiqueta.
  • 5. EL ESTILO DE HTML CON CSS CSS significa C ascading S tyle S heets Styling se puede añadir a los elementos HTML de 3 formas: •Inline - utilizando un atributo de estilo en los elementos HTML •Interno - utilizando un elemento <style> en el HTML <head>
  • 6. HTML5 •(HyperText Markup Language, versión 5) es la quinta revisión importante del lenguaje básico de la World Wide web, HtMl HTML5 especifica dos variantes de sintaxis para HTML: un «clásico» HTML (text/html),la variante conocida como html5 y una variante xhtml conosida como sintaxis que deberá ser servida como xml es la primer vez que se desarrolla en
  • 7. CÓMO CREAR MI PRIMERA PÁGINA EN HTML5 Y CSS con WebMatrix 2, algunas de las novedades en etiquetas y atributos de estos estándares y las ventajas que nos ofrece WebMatrix 2 para esta tarea Con HTML5 tendremos una web más simple y semántica gracias a las nuevas etiquetas para identificar mejor algunos elementos y cuando la selecciones te pondrá la etiqueta de cierre automáticamente para que