SlideShare una empresa de Scribd logo
1 de 32
[object Object],[object Object],[object Object]
Objetivos del Curso ,[object Object]
Temas del Curso ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Internet y la WWW ,[object Object],[object Object],[object Object],[object Object]
HTML ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Historia del HTML ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],Tim Berners-Lee Director del W3C
El W3C ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
HTML – CSS – Javascript Página Web Estructura Contenido Apariencia Comportamiento HTML CSS Javascript ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Elementos HTML ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],Elemento Etiqueta de Apertura Etiq. de Cierre Contenido <p class=“texto”>Curso HTML CEMA</p> Nombre Valor Atributo
Atributos ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Tipos de Elementos ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Estructura de un Documento HTML ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Elementos del HEAD ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Contenedores (Block-Level Elements) ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Contenedores (Tablas) ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Tablas ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Hipervínculos ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Imágenes ,[object Object],[object Object],[object Object],[object Object]
Formularios ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Formularios ,[object Object],[object Object],[object Object],[object Object],[object Object]
Más Elementos ,[object Object],[object Object],[object Object],[object Object]
Estilos CSS ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],En el documento HTML: <h2>Seminario de HTML UCEMA</h2> En la hoja de estilos se define el formato de los encabezados h2: h2 {  text-align: center;  color: blue;  font: italic large &quot;Times New Roman&quot;, serif;  }
Ventajas del uso de CSS ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Formatos CSS ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],Margin (Margen) Border (Borde) Padding (Relleno) Contenido
Estilos CSS ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],h2  {  text-align: center;  color: blue;  font: italic large &quot;Times New Roman&quot;, serif;  } .textoresaltado { font-family: Arial, Helvetica, sans-serif; font-size: 12px; font-style: normal; font-weight: bold;   /* Esto es un comentario */ color: #000000; } #logo { background-image: url(&quot;/img/logo.gif&quot;); background-position:center;  background-repeat:no-repeat; height: 50px; width: 150px; position: absolute; left: 0px; top: 0px; }
Como incluir estilos CSS ,[object Object],[object Object],[object Object],<h2 style=&quot;color: blue; background: green;&quot;> Curso HTML UCEMA  </h2>  <head>  <style type=&quot;text/css&quot;>  h2 { font-style: italic; font-weight: bold;  color: blue; }  </style>  </head> <body> <h2>Curso HTML UCEMA</h2>  </body> <head> <link rel=stylesheet type=&quot;text/css“ href=“estilos.css&quot;>  </head>
Javascript ,[object Object],[object Object],[object Object],[object Object],[object Object],DOM:  Es una interface (independiente del lenguaje) que permite a los scripts acceder dinámicamente y  actualizar el contenido, la estructura y el estilo de los documentos. Brendan Eich Creador del Javascript
Capacidades de Javascript ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Dónde incluir el Javascript ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
El Futuro ,[object Object],[object Object],[object Object],[object Object],[object Object]
Conclusiones Página Web Estructura Contenido Apariencia Comportamiento HTML CSS Javascript ,[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object],[object Object]
Preguntas ,[object Object]

Más contenido relacionado

La actualidad más candente (20)

Html, Css y JavaScript
Html, Css y JavaScriptHtml, Css y JavaScript
Html, Css y JavaScript
 
Html - Tema 1
Html - Tema 1Html - Tema 1
Html - Tema 1
 
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
 
C2 lenguaje html
C2 lenguaje htmlC2 lenguaje html
C2 lenguaje html
 
C3 lenguaje de presentación.
C3 lenguaje de presentación.C3 lenguaje de presentación.
C3 lenguaje de presentación.
 
05 Introduccion a HTML
05 Introduccion a HTML05 Introduccion a HTML
05 Introduccion a HTML
 
Lenguaje html y css
Lenguaje html y cssLenguaje html y css
Lenguaje html y css
 
Mi Primera "Pagina web
Mi Primera "Pagina webMi Primera "Pagina web
Mi Primera "Pagina web
 
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
 
Html
HtmlHtml
Html
 
Html - Tema 2: Enlaces, Imágenes y Listas
Html - Tema 2: Enlaces, Imágenes y ListasHtml - Tema 2: Enlaces, Imágenes y Listas
Html - Tema 2: Enlaces, Imágenes y Listas
 
Maquetacion
MaquetacionMaquetacion
Maquetacion
 
Html presentacion
Html presentacionHtml presentacion
Html presentacion
 
¿Qué es el lenguaje HTML?
¿Qué es el lenguaje HTML?¿Qué es el lenguaje HTML?
¿Qué es el lenguaje HTML?
 
Html - Tema 3
Html - Tema 3Html - Tema 3
Html - Tema 3
 
Html
HtmlHtml
Html
 
Html Exposicion
Html ExposicionHtml Exposicion
Html Exposicion
 
Htm ltlalti
Htm ltlaltiHtm ltlalti
Htm ltlalti
 
Introducción HTML
Introducción HTMLIntroducción HTML
Introducción HTML
 
Hojas de estilo CSS
Hojas de estilo CSSHojas de estilo CSS
Hojas de estilo CSS
 

Destacado (20)

El planeta tierra
El planeta tierraEl planeta tierra
El planeta tierra
 
Párpados
Párpados Párpados
Párpados
 
EMPOWERMENT
EMPOWERMENTEMPOWERMENT
EMPOWERMENT
 
Resultado das capacitações 40h
Resultado das capacitações  40hResultado das capacitações  40h
Resultado das capacitações 40h
 
Presentación de la investigacion 3 publicidad
Presentación de la investigacion 3 publicidadPresentación de la investigacion 3 publicidad
Presentación de la investigacion 3 publicidad
 
Ensayo innovación educativa
Ensayo innovación educativaEnsayo innovación educativa
Ensayo innovación educativa
 
2939087 nocoes-arquivologia (1)
2939087 nocoes-arquivologia (1)2939087 nocoes-arquivologia (1)
2939087 nocoes-arquivologia (1)
 
Política económica
Política económicaPolítica económica
Política económica
 
Ativ 3 marlyzynha
Ativ 3 marlyzynhaAtiv 3 marlyzynha
Ativ 3 marlyzynha
 
Bloque 0
Bloque 0Bloque 0
Bloque 0
 
Consejos para tener éxito en las redes sociales
Consejos para tener éxito en las  redes socialesConsejos para tener éxito en las  redes sociales
Consejos para tener éxito en las redes sociales
 
Tmovil
TmovilTmovil
Tmovil
 
Guía decimo periodo2 computadores 2010
Guía decimo periodo2 computadores 2010Guía decimo periodo2 computadores 2010
Guía decimo periodo2 computadores 2010
 
Mouse
MouseMouse
Mouse
 
Presentación segundo seminario_vm_2010_ab
Presentación segundo seminario_vm_2010_abPresentación segundo seminario_vm_2010_ab
Presentación segundo seminario_vm_2010_ab
 
Filosofia slow food
Filosofia slow foodFilosofia slow food
Filosofia slow food
 
Diseño web las palmas
Diseño web las palmasDiseño web las palmas
Diseño web las palmas
 
Programa unlz ii 2010
Programa unlz ii  2010Programa unlz ii  2010
Programa unlz ii 2010
 
Conmutacion en mpls
Conmutacion en mplsConmutacion en mpls
Conmutacion en mpls
 
Biodiversidad
BiodiversidadBiodiversidad
Biodiversidad
 

Similar a Html

Similar a Html (20)

HTML.ppt
HTML.pptHTML.ppt
HTML.ppt
 
Presentación de html, css y javascript.
Presentación  de html, css y javascript.Presentación  de html, css y javascript.
Presentación de html, css y javascript.
 
Tipo
TipoTipo
Tipo
 
XHTML+Inicio en CSS
XHTML+Inicio en CSSXHTML+Inicio en CSS
XHTML+Inicio en CSS
 
Retroalimentación 2011 Lopez, Carlos
Retroalimentación 2011 Lopez, CarlosRetroalimentación 2011 Lopez, Carlos
Retroalimentación 2011 Lopez, Carlos
 
Camilo diaz
Camilo diazCamilo diaz
Camilo diaz
 
Expo html
Expo htmlExpo html
Expo html
 
Presentacion asignatura
Presentacion asignaturaPresentacion asignatura
Presentacion asignatura
 
Pres 2
Pres 2Pres 2
Pres 2
 
Clase 04 Html
Clase 04   HtmlClase 04   Html
Clase 04 Html
 
Xhtml
XhtmlXhtml
Xhtml
 
Curso HTML 5 & jQuery - Leccion 1
Curso HTML 5 & jQuery - Leccion 1 Curso HTML 5 & jQuery - Leccion 1
Curso HTML 5 & jQuery - Leccion 1
 
Introducción a HTML5
Introducción a HTML5Introducción a HTML5
Introducción a HTML5
 
DIAPOSITIVA.pptx
DIAPOSITIVA.pptxDIAPOSITIVA.pptx
DIAPOSITIVA.pptx
 
Programación para web
Programación para webProgramación para web
Programación para web
 
05introduccionhtml 100901142734-phpapp02
05introduccionhtml 100901142734-phpapp0205introduccionhtml 100901142734-phpapp02
05introduccionhtml 100901142734-phpapp02
 
Lenguaje HTML y CSS
Lenguaje HTML y CSSLenguaje HTML y CSS
Lenguaje HTML y CSS
 
Diseño web con css
Diseño web con cssDiseño web con css
Diseño web con 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
 
Html.pptx
Html.pptxHtml.pptx
Html.pptx
 

Html

  • 1.
  • 2.
  • 3.
  • 4.
  • 5.
  • 6.
  • 7.
  • 8.
  • 9.
  • 10.
  • 11.
  • 12.
  • 13.
  • 14.
  • 15.
  • 16.
  • 17.
  • 18.
  • 19.
  • 20.
  • 21.
  • 22.
  • 23.
  • 24.
  • 25.
  • 26.
  • 27.
  • 28.
  • 29.
  • 30.
  • 31.
  • 32.