SlideShare uma empresa Scribd logo
1 de 10
HyperText Markup Language
(Lenguaje de Marcado de Hipertexto).
Docente: Oscar Eduardo Delgado Maya
 Es el lenguaje de marcado predominante para
la construcción de páginas web.
 Describe la estructura y el contenido en
forma de texto.
 Permite complementar el texto con objetos
tales como imágenes.
 Se escribe en forma de "etiquetas", rodeadas
por corchetes angulares (<,>).
 Los elementos son la estructura básica de HTML.
 Poseen propiedades básicas: atributos y contenido.
 Generalmente tienen una etiqueta de inicio y una
etiqueta de cierre que encierran el contenido.
<nombre-de-elemento>contenido</nombre-de-elemento>
 Estructural:Describe el propósito del texto.
◦ <h2>Golf</h2> encabezamiento de segundo
nivel.
 Presentacional:Describe la apariencia del
texto.
• <b>negrita</b> Texto resaltado.
 Hipertextual: Enlazar partes del documento
con otros documentos o con otras partes del
mismo documento.
• <a>
 <html>: Define el inicio del documento
HTML, le indica al navegador que lo que viene
a continuación debe ser interpretado como
código HTML.
 <head>: Define la cabecera del documento
HTML, esta cabecera suele contener
información sobre el documento que no se
muestra directamente al usuario.
 <body>: Define el contenido principal o
cuerpo del documento. Esta es la parte del
documento html que se muestra en el
navegador.
 <img>: imagen. Requiere del atributo src, que
indica la ruta en la que se encuentra la imagen.
 <b>: texto en negrita (Etiqueta descartada. Se
recomienda usar la etiqueta <strong>).
 <i>: texto en cursiva.
La mayoría de etiquetas deben cerrarse como se
abren, pero con una barra ("/")
<h1><i>BIENVENIDOS A MI PAGINA WEB</i></h1>
La estructura básica de todo documento web tiene:
 Una cabecera <HEAD>: donde va el título y
algunas cosas más que no se ven en la página, y
su cierre </HEAD>.
 Un cuerpo <BODY>: donde irá lo que se verá, y
su cierre </BODY>.
 Además, una etiqueta al principio de todo
<HTML> y otra al final de todo </HTML>.
Veamos como queda la estructura básica:
<HTML>
<HEAD>
.....
</HEAD>
<BODY>
.....
</BODY>
</HTML>
 Es posible añadir atributos a determinados
elementos.
 LOS ELEMENTOS estructuran el contenido de
todo el documento HTML. Indican al
navegador cómo debería presentarse el
contenido.
 En algunos elementos se puede añadir más
información. Esa información extra se
denomina atributo.
 Los atributos se incluyen siempre dentro de la
etiqueta de inicio y llevan inmediatamente detrás
el signo de igual ("=") con los valores de dichos
atributos entre comillas ("").
<nombre-eti atributo1="valor1" atributo2="valor2">conte</nombre-eti>
Elemento HTML
Etiqueta de apertura
Atributos y sus Valores

Mais conteúdo relacionado

Mais procurados

Mais procurados (20)

Introduction to html
Introduction to htmlIntroduction to html
Introduction to html
 
Presentación Powerpoint HTML
Presentación Powerpoint HTMLPresentación Powerpoint HTML
Presentación Powerpoint HTML
 
Html basics NOTE
Html basics NOTEHtml basics NOTE
Html basics NOTE
 
Robots.txt
Robots.txtRobots.txt
Robots.txt
 
Html ordered & unordered list
Html ordered & unordered listHtml ordered & unordered list
Html ordered & unordered list
 
Html
HtmlHtml
Html
 
Introduction to CSS Borders - Lesson 4
Introduction to CSS Borders - Lesson 4Introduction to CSS Borders - Lesson 4
Introduction to CSS Borders - Lesson 4
 
Hushang Gaikwad
Hushang GaikwadHushang Gaikwad
Hushang Gaikwad
 
HTML/HTML5
HTML/HTML5HTML/HTML5
HTML/HTML5
 
Introduction to Web Development - CSS
Introduction to Web Development - CSSIntroduction to Web Development - CSS
Introduction to Web Development - CSS
 
HTML
HTMLHTML
HTML
 
Basic Html Notes
Basic Html NotesBasic Html Notes
Basic Html Notes
 
Basic Introduction to Web Development
Basic Introduction to Web DevelopmentBasic Introduction to Web Development
Basic Introduction to Web Development
 
Bootstrap Part - 1
Bootstrap Part - 1Bootstrap Part - 1
Bootstrap Part - 1
 
Html ppt
Html pptHtml ppt
Html ppt
 
Getting into HTML
Getting into HTMLGetting into HTML
Getting into HTML
 
Intro Html
Intro HtmlIntro Html
Intro Html
 
LINKING IN HTML
LINKING IN HTMLLINKING IN HTML
LINKING IN HTML
 
HTML5: features with examples
HTML5: features with examplesHTML5: features with examples
HTML5: features with examples
 
Html & Css presentation
Html  & Css presentation Html  & Css presentation
Html & Css presentation
 

Semelhante a El lenguaje html (20)

Slideshare
SlideshareSlideshare
Slideshare
 
Html
HtmlHtml
Html
 
Investigacion de html y xml
Investigacion de html y xmlInvestigacion de html y xml
Investigacion de html y xml
 
HTML HyperText Markup Language
HTML HyperText Markup LanguageHTML HyperText Markup Language
HTML HyperText Markup Language
 
Tags actividad 11 jmar 180112
Tags actividad 11 jmar 180112Tags actividad 11 jmar 180112
Tags actividad 11 jmar 180112
 
El código html
El código htmlEl código html
El código html
 
Html 121
Html 121Html 121
Html 121
 
Html
HtmlHtml
Html
 
Sitio Web / Introducción a HTML
Sitio Web / Introducción a HTMLSitio Web / Introducción a HTML
Sitio Web / Introducción a HTML
 
Html
HtmlHtml
Html
 
Lissette lainez
Lissette lainezLissette lainez
Lissette lainez
 
Lissette lainez
Lissette lainezLissette lainez
Lissette lainez
 
etiquetas basicas de html
etiquetas basicas de htmletiquetas basicas de html
etiquetas basicas de html
 
Israel
IsraelIsrael
Israel
 
Israel
IsraelIsrael
Israel
 
Acerca de html
Acerca de htmlAcerca de html
Acerca de html
 
Deber de htmly xml
Deber de htmly xmlDeber de htmly xml
Deber de htmly xml
 
Taller 1 mariana barreto
Taller 1 mariana barretoTaller 1 mariana barreto
Taller 1 mariana barreto
 
Emily
EmilyEmily
Emily
 
Html
HtmlHtml
Html
 

Último

Concepto y definición de tipos de Datos Abstractos en c++.pptx
Concepto y definición de tipos de Datos Abstractos en c++.pptxConcepto y definición de tipos de Datos Abstractos en c++.pptx
Concepto y definición de tipos de Datos Abstractos en c++.pptx
Fernando Solis
 
6°_GRADO_-_MAYO_06 para sexto grado de primaria
6°_GRADO_-_MAYO_06 para sexto grado de primaria6°_GRADO_-_MAYO_06 para sexto grado de primaria
6°_GRADO_-_MAYO_06 para sexto grado de primaria
Wilian24
 
Proyecto de aprendizaje dia de la madre MINT.pdf
Proyecto de aprendizaje dia de la madre MINT.pdfProyecto de aprendizaje dia de la madre MINT.pdf
Proyecto de aprendizaje dia de la madre MINT.pdf
patriciaines1993
 
NUEVAS DIAPOSITIVAS POSGRADO Gestion Publica.pdf
NUEVAS DIAPOSITIVAS POSGRADO Gestion Publica.pdfNUEVAS DIAPOSITIVAS POSGRADO Gestion Publica.pdf
NUEVAS DIAPOSITIVAS POSGRADO Gestion Publica.pdf
UPTAIDELTACHIRA
 

Último (20)

SEPTIMO SEGUNDO PERIODO EMPRENDIMIENTO VS
SEPTIMO SEGUNDO PERIODO EMPRENDIMIENTO VSSEPTIMO SEGUNDO PERIODO EMPRENDIMIENTO VS
SEPTIMO SEGUNDO PERIODO EMPRENDIMIENTO VS
 
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
 
ACRÓNIMO DE PARÍS PARA SU OLIMPIADA 2024. Por JAVIER SOLIS NOYOLA
ACRÓNIMO DE PARÍS PARA SU OLIMPIADA 2024. Por JAVIER SOLIS NOYOLAACRÓNIMO DE PARÍS PARA SU OLIMPIADA 2024. Por JAVIER SOLIS NOYOLA
ACRÓNIMO DE PARÍS PARA SU OLIMPIADA 2024. Por JAVIER SOLIS NOYOLA
 
EL HABITO DEL AHORRO en tu idea emprendedora22-04-24.pptx
EL HABITO DEL AHORRO en tu idea emprendedora22-04-24.pptxEL HABITO DEL AHORRO en tu idea emprendedora22-04-24.pptx
EL HABITO DEL AHORRO en tu idea emprendedora22-04-24.pptx
 
Concepto y definición de tipos de Datos Abstractos en c++.pptx
Concepto y definición de tipos de Datos Abstractos en c++.pptxConcepto y definición de tipos de Datos Abstractos en c++.pptx
Concepto y definición de tipos de Datos Abstractos en c++.pptx
 
6°_GRADO_-_MAYO_06 para sexto grado de primaria
6°_GRADO_-_MAYO_06 para sexto grado de primaria6°_GRADO_-_MAYO_06 para sexto grado de primaria
6°_GRADO_-_MAYO_06 para sexto grado de primaria
 
origen y desarrollo del ensayo literario
origen y desarrollo del ensayo literarioorigen y desarrollo del ensayo literario
origen y desarrollo del ensayo literario
 
Proyecto de aprendizaje dia de la madre MINT.pdf
Proyecto de aprendizaje dia de la madre MINT.pdfProyecto de aprendizaje dia de la madre MINT.pdf
Proyecto de aprendizaje dia de la madre MINT.pdf
 
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
 
SEXTO SEGUNDO PERIODO EMPRENDIMIENTO.pptx
SEXTO SEGUNDO PERIODO EMPRENDIMIENTO.pptxSEXTO SEGUNDO PERIODO EMPRENDIMIENTO.pptx
SEXTO SEGUNDO PERIODO EMPRENDIMIENTO.pptx
 
FUERZA Y MOVIMIENTO ciencias cuarto basico.ppt
FUERZA Y MOVIMIENTO ciencias cuarto basico.pptFUERZA Y MOVIMIENTO ciencias cuarto basico.ppt
FUERZA Y MOVIMIENTO ciencias cuarto basico.ppt
 
Diapositivas de animales reptiles secundaria
Diapositivas de animales reptiles secundariaDiapositivas de animales reptiles secundaria
Diapositivas de animales reptiles secundaria
 
La Sostenibilidad Corporativa. Administración Ambiental
La Sostenibilidad Corporativa. Administración AmbientalLa Sostenibilidad Corporativa. Administración Ambiental
La Sostenibilidad Corporativa. Administración Ambiental
 
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
 
Análisis de los Factores Externos de la Organización.
Análisis de los Factores Externos de la Organización.Análisis de los Factores Externos de la Organización.
Análisis de los Factores Externos de la Organización.
 
NUEVAS DIAPOSITIVAS POSGRADO Gestion Publica.pdf
NUEVAS DIAPOSITIVAS POSGRADO Gestion Publica.pdfNUEVAS DIAPOSITIVAS POSGRADO Gestion Publica.pdf
NUEVAS DIAPOSITIVAS POSGRADO Gestion Publica.pdf
 
OCTAVO SEGUNDO PERIODO. EMPRENDIEMIENTO VS
OCTAVO SEGUNDO PERIODO. EMPRENDIEMIENTO VSOCTAVO SEGUNDO PERIODO. EMPRENDIEMIENTO VS
OCTAVO SEGUNDO PERIODO. EMPRENDIEMIENTO VS
 
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
 
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
 
SISTEMA RESPIRATORIO PARA NIÑOS PRIMARIA
SISTEMA RESPIRATORIO PARA NIÑOS PRIMARIASISTEMA RESPIRATORIO PARA NIÑOS PRIMARIA
SISTEMA RESPIRATORIO PARA NIÑOS PRIMARIA
 

El lenguaje html

  • 1. HyperText Markup Language (Lenguaje de Marcado de Hipertexto). Docente: Oscar Eduardo Delgado Maya
  • 2.  Es el lenguaje de marcado predominante para la construcción de páginas web.  Describe la estructura y el contenido en forma de texto.  Permite complementar el texto con objetos tales como imágenes.  Se escribe en forma de "etiquetas", rodeadas por corchetes angulares (<,>).
  • 3.  Los elementos son la estructura básica de HTML.  Poseen propiedades básicas: atributos y contenido.  Generalmente tienen una etiqueta de inicio y una etiqueta de cierre que encierran el contenido. <nombre-de-elemento>contenido</nombre-de-elemento>
  • 4.  Estructural:Describe el propósito del texto. ◦ <h2>Golf</h2> encabezamiento de segundo nivel.  Presentacional:Describe la apariencia del texto. • <b>negrita</b> Texto resaltado.  Hipertextual: Enlazar partes del documento con otros documentos o con otras partes del mismo documento. • <a>
  • 5.  <html>: Define el inicio del documento HTML, le indica al navegador que lo que viene a continuación debe ser interpretado como código HTML.  <head>: Define la cabecera del documento HTML, esta cabecera suele contener información sobre el documento que no se muestra directamente al usuario.  <body>: Define el contenido principal o cuerpo del documento. Esta es la parte del documento html que se muestra en el navegador.
  • 6.  <img>: imagen. Requiere del atributo src, que indica la ruta en la que se encuentra la imagen.  <b>: texto en negrita (Etiqueta descartada. Se recomienda usar la etiqueta <strong>).  <i>: texto en cursiva. La mayoría de etiquetas deben cerrarse como se abren, pero con una barra ("/") <h1><i>BIENVENIDOS A MI PAGINA WEB</i></h1>
  • 7. La estructura básica de todo documento web tiene:  Una cabecera <HEAD>: donde va el título y algunas cosas más que no se ven en la página, y su cierre </HEAD>.  Un cuerpo <BODY>: donde irá lo que se verá, y su cierre </BODY>.  Además, una etiqueta al principio de todo <HTML> y otra al final de todo </HTML>.
  • 8. Veamos como queda la estructura básica: <HTML> <HEAD> ..... </HEAD> <BODY> ..... </BODY> </HTML>
  • 9.  Es posible añadir atributos a determinados elementos.  LOS ELEMENTOS estructuran el contenido de todo el documento HTML. Indican al navegador cómo debería presentarse el contenido.  En algunos elementos se puede añadir más información. Esa información extra se denomina atributo.
  • 10.  Los atributos se incluyen siempre dentro de la etiqueta de inicio y llevan inmediatamente detrás el signo de igual ("=") con los valores de dichos atributos entre comillas (""). <nombre-eti atributo1="valor1" atributo2="valor2">conte</nombre-eti> Elemento HTML Etiqueta de apertura Atributos y sus Valores