SlideShare una empresa de Scribd logo
1 de 15
LENGUAJE HTML

Deisy Nohemì Mateo Damián
Qué es el HTML

  El HTML(Hyper Text Markup Language)
   es un sistema para estructurar
   documentos. Estos documentos pueden
   ser mostrados por los visores de páginas
   Web en Internet, como Netscape, Mosaic
   o Microsoft Explorer. Por el momento no
   existe un estándar de HTML,
Estructura básica de
un documento HTML
  Un documento escrito en HTML contendría
   básicamente las siguientes directivas:
  <HTML> <HEAD> <TITLE> </TITLE>
   </HEAD> <BODY> </BODY> </HTML> Indica
   el inicio del documento. Inicio de la cabecera.
   Inicio del título del documento. Final del título
   del documento. Final de la cabecera del
   documento. Inicio del cuerpo del documento.
   Final del cuerpo del documento. Final del
   documento.
Cabecera del
documento

 La directiva <HEAD></HEAD> delimita
  la cabecera del documento. Dentro de la
  cabecera es importante definir el título de
  la página por medio de la directiva
  <TITLE></TITLE>. Este título será el
  que aparezca en la barra de nuestro
  visor de páginas Web.
Cuerpo del documento

 La directiva <BODY></BODY> indica el
  inicio y final de nuestra pagina Web.
  Será entre el inicio y el final de esta
  directiva donde pongamos los
  contenidos de nuestra página, textos,
  gráficos, enlaces, etc...
 El código de color es un número
  compuesto por tres pares de cifras
  hexadecimales que indican la proporción
  de los colores "primarios", rojo, verde y
  azul. El código de color se antecede del
  símbolo #. Ejemplos:

 Ejemplos:
 #000000
  #FF0000
  #00FF00
  #0000FF
  #FFFFFF
  Color Negro
  Color Rojo
  Color Verde
  Color Azul
  Color Blanco
Espaciados y saltos de
línea

   En HTML sólo se reconoce un espacio
   entre palabra y palabra, el resto de los
   espacios serán ignorados por el visor.
 Ejemplo Se verá como Esto es una frase
   Esto es una frase
CABECERAS

 En un documento de HTML se pueden
  indicar seis tipos de cabeceras (tamaños
  de letra) por medio de las directivas
  <H1><H2><H3><H4><H5> y <H6>. El
  texto que escribamos entre el inicio y el
  fin de la directiva será el afectado por las
  cabeceras. La cabecera <H1> será la
  que muestre el texto en mayor tamaño.
Listas de elementos

  Existen tres tipos de listas: numeradas, sin
   numerar y de definición.
   Las listas numeradas representarán los
   elementos de la lista numerando cada uno de
   ellos según el lugar que ocupan en la lista.
   Para este tipo de lista se utiliza la directiva
   <OL></OL>. Cada uno de los elementos de la
   lista irá precedido de la directiva <LI>. La
   directiva <OL> puede llevar los siguientes
   parámetros:
 start = num
   Indica que número será el primero de la lista. Si no
    se indica se entiende que empezará por el número
    1. Se indica numéricamente, independientemente
    del tipo que se elija.
 type = tipo
   Indica el tipo de numeración utilizada. Si no se
    indica se entiende que será una lista ordenada
    numéricamente.
Imágenes

  Hasta el momento hemos visto como se puede escribir
   texto en una página Web, así como sus posibles
   formatos. Para incluir una imagen en nuestra página
   Web utilizaremos la directiva <IMG>. Hay dos formatos
   de imágenes que todos los navegadores modernos
   reconocen. Son las imágenes GIF y JPG. Cualquier
   otro tipo de fichero gráfico o de imagen (BMP, PCX,
   CDR, etc...) no será mostrado por el visor, a no ser
   que disponga de un programa externo que permita su
   visualización
Hyperenlaces.

 La característica principal de una página
  Web es que podemos incluir
  Hyperenlaces. Un Hyperenlace es un
  elemento de la página que hace que el
  navegador acceda a otro recurso, otra
  página Web, un archivo, etc
Tablas

 Las tablas nos permiten representar
  cualquier elemento de nuestra página
  (texto, listas, imágenes, etc...) en
  diferentes filas y columnas separadas
  entre sí. Es una herramienta muy útil
  para "ordenar" contenidos de distintas
  partes de nuestra página. La tabla se
  define mediante la directiva <TABLE></
  TABLE>.
Mapas
 Un Mapa es una imagen que permite realizar
  diferentes Hyperenlaces en función de la
  "zona" de la imagen que se pulse. Para crear
  un mapa debemos tener un fichero con la
  imagen y un conjunto de órdenes donde
  indicaremos las coordenadas de la imagen que
  nos enlazarán con cada Hyperenlace.
  Actualmente hay dos maneras de hacer los
  mapas: a través de un programa externo (CGI)
  que pueda "procesar" el fichero .map en el que
  habremos metidos las órdenes, o a través de
  la directiva

Más contenido relacionado

La actualidad más candente

Word y sus barras
Word y sus barrasWord y sus barras
Word y sus barras
anaymeli
 
Iconos de la Barra de inicio de word 2007
Iconos de la Barra de inicio de word 2007Iconos de la Barra de inicio de word 2007
Iconos de la Barra de inicio de word 2007
katherine14
 

La actualidad más candente (20)

Html
HtmlHtml
Html
 
Crear base de datos mysql command
Crear base de datos mysql commandCrear base de datos mysql command
Crear base de datos mysql command
 
Word y sus barras
Word y sus barrasWord y sus barras
Word y sus barras
 
Que es access
Que es accessQue es access
Que es access
 
Trucos para word
Trucos para wordTrucos para word
Trucos para word
 
Iconos de la Barra de inicio de word 2007
Iconos de la Barra de inicio de word 2007Iconos de la Barra de inicio de word 2007
Iconos de la Barra de inicio de word 2007
 
Trucos de word
Trucos de wordTrucos de word
Trucos de word
 
HTML
HTMLHTML
HTML
 
Luis
LuisLuis
Luis
 
Texto del manual de html
Texto del manual de htmlTexto del manual de html
Texto del manual de html
 
Resumen analítico de access
Resumen analítico de accessResumen analítico de access
Resumen analítico de access
 
UtplMadrid_Tutorías_Computación Básica_ Word
UtplMadrid_Tutorías_Computación Básica_ WordUtplMadrid_Tutorías_Computación Básica_ Word
UtplMadrid_Tutorías_Computación Básica_ Word
 
Resumen analítico de access
Resumen analítico de accessResumen analítico de access
Resumen analítico de access
 
Curso HTML 5 & jQuery - Leccion 2
Curso HTML 5 & jQuery - Leccion 2Curso HTML 5 & jQuery - Leccion 2
Curso HTML 5 & jQuery - Leccion 2
 
Guia de base de datos
Guia de base de datosGuia de base de datos
Guia de base de datos
 
Html
HtmlHtml
Html
 
¿Qué es el lenguaje HTML?
¿Qué es el lenguaje HTML?¿Qué es el lenguaje HTML?
¿Qué es el lenguaje HTML?
 
Guia básica html
Guia básica htmlGuia básica html
Guia básica html
 
Lenguaje HTML
Lenguaje HTMLLenguaje HTML
Lenguaje HTML
 
Herramientas de word
Herramientas de wordHerramientas de word
Herramientas de word
 

Destacado

El valor de las vitaminas d y e
El valor de las vitaminas d y eEl valor de las vitaminas d y e
El valor de las vitaminas d y e
EveliaeS
 
Rasululullah sebagai Suami
Rasululullah sebagai SuamiRasululullah sebagai Suami
Rasululullah sebagai Suami
Abyanuddin Salam
 
Pendidikan agama tatap muka iv
Pendidikan agama tatap muka ivPendidikan agama tatap muka iv
Pendidikan agama tatap muka iv
Nurul Arifin S
 
Parcial fijacion de precios (2)
Parcial fijacion de precios (2)Parcial fijacion de precios (2)
Parcial fijacion de precios (2)
Ricardo Pesca
 
1.biologi umum (Intro)
1.biologi umum (Intro)1.biologi umum (Intro)
1.biologi umum (Intro)
Nonox Muryono
 
Adore-it Actions
Adore-it ActionsAdore-it Actions
Adore-it Actions
adoreit
 
bristol myerd squibb Bristol-Myers Squibb Company Reports First Quarter 2008 ...
bristol myerd squibb Bristol-Myers Squibb Company Reports First Quarter 2008 ...bristol myerd squibb Bristol-Myers Squibb Company Reports First Quarter 2008 ...
bristol myerd squibb Bristol-Myers Squibb Company Reports First Quarter 2008 ...
finance13
 

Destacado (20)

Soal latihan1mekanika
Soal latihan1mekanikaSoal latihan1mekanika
Soal latihan1mekanika
 
Ntpc2 111125042448-phpapp02
Ntpc2 111125042448-phpapp02Ntpc2 111125042448-phpapp02
Ntpc2 111125042448-phpapp02
 
A Flor de Abril
A Flor de AbrilA Flor de Abril
A Flor de Abril
 
El valor de las vitaminas d y e
El valor de las vitaminas d y eEl valor de las vitaminas d y e
El valor de las vitaminas d y e
 
Canal local
Canal localCanal local
Canal local
 
Rumah cisaranten
Rumah cisarantenRumah cisaranten
Rumah cisaranten
 
Etude cas France-IX InterCloud
Etude cas France-IX InterCloudEtude cas France-IX InterCloud
Etude cas France-IX InterCloud
 
Rasululullah sebagai Suami
Rasululullah sebagai SuamiRasululullah sebagai Suami
Rasululullah sebagai Suami
 
Power, Community & Land Reform In Scotland [Tim Braunholtz Speight]
Power, Community & Land Reform In Scotland [Tim Braunholtz Speight]Power, Community & Land Reform In Scotland [Tim Braunholtz Speight]
Power, Community & Land Reform In Scotland [Tim Braunholtz Speight]
 
Pendidikan agama tatap muka iv
Pendidikan agama tatap muka ivPendidikan agama tatap muka iv
Pendidikan agama tatap muka iv
 
Mobile Turn West
Mobile Turn WestMobile Turn West
Mobile Turn West
 
Eq2 Presentation Property Brief
Eq2  Presentation   Property  BriefEq2  Presentation   Property  Brief
Eq2 Presentation Property Brief
 
Parcial fijacion de precios (2)
Parcial fijacion de precios (2)Parcial fijacion de precios (2)
Parcial fijacion de precios (2)
 
1.biologi umum (Intro)
1.biologi umum (Intro)1.biologi umum (Intro)
1.biologi umum (Intro)
 
Petualangan Alam Liar
Petualangan Alam LiarPetualangan Alam Liar
Petualangan Alam Liar
 
япония
японияяпония
япония
 
Adore-it Actions
Adore-it ActionsAdore-it Actions
Adore-it Actions
 
Manual mutu fkip ok
Manual mutu fkip okManual mutu fkip ok
Manual mutu fkip ok
 
bristol myerd squibb Bristol-Myers Squibb Company Reports First Quarter 2008 ...
bristol myerd squibb Bristol-Myers Squibb Company Reports First Quarter 2008 ...bristol myerd squibb Bristol-Myers Squibb Company Reports First Quarter 2008 ...
bristol myerd squibb Bristol-Myers Squibb Company Reports First Quarter 2008 ...
 
Kentsel ulaşımda verimliliğin arttırılması
Kentsel ulaşımda verimliliğin arttırılmasıKentsel ulaşımda verimliliğin arttırılması
Kentsel ulaşımda verimliliğin arttırılması
 

Similar a html (20)

LENGUAJE HTML
LENGUAJE HTMLLENGUAJE HTML
LENGUAJE HTML
 
Lenguaje HTML
Lenguaje HTMLLenguaje HTML
Lenguaje HTML
 
html
htmlhtml
html
 
Lenguaje HTML
  Lenguaje HTML  Lenguaje HTML
Lenguaje HTML
 
HTML
HTMLHTML
HTML
 
Unidad # 1
Unidad # 1Unidad # 1
Unidad # 1
 
Unidad # 1
Unidad # 1Unidad # 1
Unidad # 1
 
Lenguaje html
Lenguaje htmlLenguaje html
Lenguaje html
 
Guia html
Guia htmlGuia html
Guia html
 
Html
HtmlHtml
Html
 
Intro html
Intro htmlIntro html
Intro html
 
Html
HtmlHtml
Html
 
Qué es un diagrama de flujo en programación 2
Qué es un diagrama de flujo en programación 2Qué es un diagrama de flujo en programación 2
Qué es un diagrama de flujo en programación 2
 
Presentación Powerpoint HTML
Presentación Powerpoint HTMLPresentación Powerpoint HTML
Presentación Powerpoint HTML
 
DISEÑO WEB - HTML 5 - PRINCIPIOS BASICOS.pptx
DISEÑO WEB - HTML 5 - PRINCIPIOS BASICOS.pptxDISEÑO WEB - HTML 5 - PRINCIPIOS BASICOS.pptx
DISEÑO WEB - HTML 5 - PRINCIPIOS BASICOS.pptx
 
HTML
HTMLHTML
HTML
 
HTML
HTMLHTML
HTML
 
html
htmlhtml
html
 
Html
HtmlHtml
Html
 
Desarrolla aplicaciones-web
Desarrolla aplicaciones-webDesarrolla aplicaciones-web
Desarrolla aplicaciones-web
 

Último

Curso = Metodos Tecnicas y Modelos de Enseñanza.pdf
Curso = Metodos Tecnicas y Modelos de Enseñanza.pdfCurso = Metodos Tecnicas y Modelos de Enseñanza.pdf
Curso = Metodos Tecnicas y Modelos de Enseñanza.pdf
Francisco158360
 
PLAN DE REFUERZO ESCOLAR primaria (1).docx
PLAN DE REFUERZO ESCOLAR primaria (1).docxPLAN DE REFUERZO ESCOLAR primaria (1).docx
PLAN DE REFUERZO ESCOLAR primaria (1).docx
lupitavic
 
ACUERDO MINISTERIAL 078-ORGANISMOS ESCOLARES..pptx
ACUERDO MINISTERIAL 078-ORGANISMOS ESCOLARES..pptxACUERDO MINISTERIAL 078-ORGANISMOS ESCOLARES..pptx
ACUERDO MINISTERIAL 078-ORGANISMOS ESCOLARES..pptx
zulyvero07
 

Último (20)

Tema 8.- PROTECCION DE LOS SISTEMAS DE INFORMACIÓN.pdf
Tema 8.- PROTECCION DE LOS SISTEMAS DE INFORMACIÓN.pdfTema 8.- PROTECCION DE LOS SISTEMAS DE INFORMACIÓN.pdf
Tema 8.- PROTECCION DE LOS SISTEMAS DE INFORMACIÓN.pdf
 
Unidad 3 | Metodología de la Investigación
Unidad 3 | Metodología de la InvestigaciónUnidad 3 | Metodología de la Investigación
Unidad 3 | Metodología de la Investigación
 
Ejercicios de PROBLEMAS PAEV 6 GRADO 2024.pdf
Ejercicios de PROBLEMAS PAEV 6 GRADO 2024.pdfEjercicios de PROBLEMAS PAEV 6 GRADO 2024.pdf
Ejercicios de PROBLEMAS PAEV 6 GRADO 2024.pdf
 
Plan Refuerzo Escolar 2024 para estudiantes con necesidades de Aprendizaje en...
Plan Refuerzo Escolar 2024 para estudiantes con necesidades de Aprendizaje en...Plan Refuerzo Escolar 2024 para estudiantes con necesidades de Aprendizaje en...
Plan Refuerzo Escolar 2024 para estudiantes con necesidades de Aprendizaje en...
 
Estrategia de prompts, primeras ideas para su construcción
Estrategia de prompts, primeras ideas para su construcciónEstrategia de prompts, primeras ideas para su construcción
Estrategia de prompts, primeras ideas para su construcción
 
Ley 21.545 - Circular Nº 586.pdf circular
Ley 21.545 - Circular Nº 586.pdf circularLey 21.545 - Circular Nº 586.pdf circular
Ley 21.545 - Circular Nº 586.pdf circular
 
MAYO 1 PROYECTO día de la madre el amor más grande
MAYO 1 PROYECTO día de la madre el amor más grandeMAYO 1 PROYECTO día de la madre el amor más grande
MAYO 1 PROYECTO día de la madre el amor más grande
 
Curso = Metodos Tecnicas y Modelos de Enseñanza.pdf
Curso = Metodos Tecnicas y Modelos de Enseñanza.pdfCurso = Metodos Tecnicas y Modelos de Enseñanza.pdf
Curso = Metodos Tecnicas y Modelos de Enseñanza.pdf
 
Lecciones 05 Esc. Sabática. Fe contra todo pronóstico.
Lecciones 05 Esc. Sabática. Fe contra todo pronóstico.Lecciones 05 Esc. Sabática. Fe contra todo pronóstico.
Lecciones 05 Esc. Sabática. Fe contra todo pronóstico.
 
proyecto de mayo inicial 5 añitos aprender es bueno para tu niño
proyecto de mayo inicial 5 añitos aprender es bueno para tu niñoproyecto de mayo inicial 5 añitos aprender es bueno para tu niño
proyecto de mayo inicial 5 añitos aprender es bueno para tu niño
 
ORGANIZACIÓN SOCIAL INCA EN EL TAHUANTINSUYO.pptx
ORGANIZACIÓN SOCIAL INCA EN EL TAHUANTINSUYO.pptxORGANIZACIÓN SOCIAL INCA EN EL TAHUANTINSUYO.pptx
ORGANIZACIÓN SOCIAL INCA EN EL TAHUANTINSUYO.pptx
 
Programacion Anual Matemática4 MPG 2024 Ccesa007.pdf
Programacion Anual Matemática4    MPG 2024  Ccesa007.pdfProgramacion Anual Matemática4    MPG 2024  Ccesa007.pdf
Programacion Anual Matemática4 MPG 2024 Ccesa007.pdf
 
Sesión de aprendizaje Planifica Textos argumentativo.docx
Sesión de aprendizaje Planifica Textos argumentativo.docxSesión de aprendizaje Planifica Textos argumentativo.docx
Sesión de aprendizaje Planifica Textos argumentativo.docx
 
Estrategias de enseñanza-aprendizaje virtual.pptx
Estrategias de enseñanza-aprendizaje virtual.pptxEstrategias de enseñanza-aprendizaje virtual.pptx
Estrategias de enseñanza-aprendizaje virtual.pptx
 
Qué es la Inteligencia artificial generativa
Qué es la Inteligencia artificial generativaQué es la Inteligencia artificial generativa
Qué es la Inteligencia artificial generativa
 
PLAN DE REFUERZO ESCOLAR primaria (1).docx
PLAN DE REFUERZO ESCOLAR primaria (1).docxPLAN DE REFUERZO ESCOLAR primaria (1).docx
PLAN DE REFUERZO ESCOLAR primaria (1).docx
 
plande accion dl aula de innovación pedagogica 2024.pdf
plande accion dl aula de innovación pedagogica 2024.pdfplande accion dl aula de innovación pedagogica 2024.pdf
plande accion dl aula de innovación pedagogica 2024.pdf
 
Registro Auxiliar - Primaria 2024 (1).pptx
Registro Auxiliar - Primaria  2024 (1).pptxRegistro Auxiliar - Primaria  2024 (1).pptx
Registro Auxiliar - Primaria 2024 (1).pptx
 
ACUERDO MINISTERIAL 078-ORGANISMOS ESCOLARES..pptx
ACUERDO MINISTERIAL 078-ORGANISMOS ESCOLARES..pptxACUERDO MINISTERIAL 078-ORGANISMOS ESCOLARES..pptx
ACUERDO MINISTERIAL 078-ORGANISMOS ESCOLARES..pptx
 
PIAR v 015. 2024 Plan Individual de ajustes razonables
PIAR v 015. 2024 Plan Individual de ajustes razonablesPIAR v 015. 2024 Plan Individual de ajustes razonables
PIAR v 015. 2024 Plan Individual de ajustes razonables
 

html

  • 2. Qué es el HTML  El HTML(Hyper Text Markup Language) es un sistema para estructurar documentos. Estos documentos pueden ser mostrados por los visores de páginas Web en Internet, como Netscape, Mosaic o Microsoft Explorer. Por el momento no existe un estándar de HTML,
  • 3. Estructura básica de un documento HTML  Un documento escrito en HTML contendría básicamente las siguientes directivas:  <HTML> <HEAD> <TITLE> </TITLE> </HEAD> <BODY> </BODY> </HTML> Indica el inicio del documento. Inicio de la cabecera. Inicio del título del documento. Final del título del documento. Final de la cabecera del documento. Inicio del cuerpo del documento. Final del cuerpo del documento. Final del documento.
  • 4. Cabecera del documento  La directiva <HEAD></HEAD> delimita la cabecera del documento. Dentro de la cabecera es importante definir el título de la página por medio de la directiva <TITLE></TITLE>. Este título será el que aparezca en la barra de nuestro visor de páginas Web.
  • 5. Cuerpo del documento  La directiva <BODY></BODY> indica el inicio y final de nuestra pagina Web. Será entre el inicio y el final de esta directiva donde pongamos los contenidos de nuestra página, textos, gráficos, enlaces, etc...
  • 6.  El código de color es un número compuesto por tres pares de cifras hexadecimales que indican la proporción de los colores "primarios", rojo, verde y azul. El código de color se antecede del símbolo #. Ejemplos: 
  • 7.  Ejemplos:  #000000 #FF0000 #00FF00 #0000FF #FFFFFF Color Negro Color Rojo Color Verde Color Azul Color Blanco
  • 8. Espaciados y saltos de línea En HTML sólo se reconoce un espacio entre palabra y palabra, el resto de los espacios serán ignorados por el visor. Ejemplo Se verá como Esto es una frase Esto es una frase
  • 9. CABECERAS  En un documento de HTML se pueden indicar seis tipos de cabeceras (tamaños de letra) por medio de las directivas <H1><H2><H3><H4><H5> y <H6>. El texto que escribamos entre el inicio y el fin de la directiva será el afectado por las cabeceras. La cabecera <H1> será la que muestre el texto en mayor tamaño.
  • 10. Listas de elementos  Existen tres tipos de listas: numeradas, sin numerar y de definición. Las listas numeradas representarán los elementos de la lista numerando cada uno de ellos según el lugar que ocupan en la lista. Para este tipo de lista se utiliza la directiva <OL></OL>. Cada uno de los elementos de la lista irá precedido de la directiva <LI>. La directiva <OL> puede llevar los siguientes parámetros:
  • 11.  start = num  Indica que número será el primero de la lista. Si no se indica se entiende que empezará por el número 1. Se indica numéricamente, independientemente del tipo que se elija.  type = tipo  Indica el tipo de numeración utilizada. Si no se indica se entiende que será una lista ordenada numéricamente.
  • 12. Imágenes  Hasta el momento hemos visto como se puede escribir texto en una página Web, así como sus posibles formatos. Para incluir una imagen en nuestra página Web utilizaremos la directiva <IMG>. Hay dos formatos de imágenes que todos los navegadores modernos reconocen. Son las imágenes GIF y JPG. Cualquier otro tipo de fichero gráfico o de imagen (BMP, PCX, CDR, etc...) no será mostrado por el visor, a no ser que disponga de un programa externo que permita su visualización
  • 13. Hyperenlaces.  La característica principal de una página Web es que podemos incluir Hyperenlaces. Un Hyperenlace es un elemento de la página que hace que el navegador acceda a otro recurso, otra página Web, un archivo, etc
  • 14. Tablas  Las tablas nos permiten representar cualquier elemento de nuestra página (texto, listas, imágenes, etc...) en diferentes filas y columnas separadas entre sí. Es una herramienta muy útil para "ordenar" contenidos de distintas partes de nuestra página. La tabla se define mediante la directiva <TABLE></ TABLE>.
  • 15. Mapas  Un Mapa es una imagen que permite realizar diferentes Hyperenlaces en función de la "zona" de la imagen que se pulse. Para crear un mapa debemos tener un fichero con la imagen y un conjunto de órdenes donde indicaremos las coordenadas de la imagen que nos enlazarán con cada Hyperenlace. Actualmente hay dos maneras de hacer los mapas: a través de un programa externo (CGI) que pueda "procesar" el fichero .map en el que habremos metidos las órdenes, o a través de la directiva