SlideShare uma empresa 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

Mais conteúdo relacionado

Mais procurados

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
 

Mais procurados (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
 

Destaque

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
 

Destaque (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ı
 

Semelhante 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

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
 
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
 
6.-Como-Atraer-El-Amor-01-Lain-Garcia-Calvo.pdf
6.-Como-Atraer-El-Amor-01-Lain-Garcia-Calvo.pdf6.-Como-Atraer-El-Amor-01-Lain-Garcia-Calvo.pdf
6.-Como-Atraer-El-Amor-01-Lain-Garcia-Calvo.pdf
MiNeyi1
 

Último (20)

Power Point: Fe contra todo pronóstico.pptx
Power Point: Fe contra todo pronóstico.pptxPower Point: Fe contra todo pronóstico.pptx
Power Point: Fe contra todo pronóstico.pptx
 
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
 
2024 KIT DE HABILIDADES SOCIOEMOCIONALES.pdf
2024 KIT DE HABILIDADES SOCIOEMOCIONALES.pdf2024 KIT DE HABILIDADES SOCIOEMOCIONALES.pdf
2024 KIT DE HABILIDADES SOCIOEMOCIONALES.pdf
 
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
 
Abril 2024 - Maestra Jardinera Ediba.pdf
Abril 2024 -  Maestra Jardinera Ediba.pdfAbril 2024 -  Maestra Jardinera Ediba.pdf
Abril 2024 - Maestra Jardinera Ediba.pdf
 
GUIA DE CIRCUNFERENCIA Y ELIPSE UNDÉCIMO 2024.pdf
GUIA DE CIRCUNFERENCIA Y ELIPSE UNDÉCIMO 2024.pdfGUIA DE CIRCUNFERENCIA Y ELIPSE UNDÉCIMO 2024.pdf
GUIA DE CIRCUNFERENCIA Y ELIPSE UNDÉCIMO 2024.pdf
 
Presentacion Metodología de Enseñanza Multigrado
Presentacion Metodología de Enseñanza MultigradoPresentacion Metodología de Enseñanza Multigrado
Presentacion Metodología de Enseñanza Multigrado
 
Programacion Anual Matemática5 MPG 2024 Ccesa007.pdf
Programacion Anual Matemática5    MPG 2024  Ccesa007.pdfProgramacion Anual Matemática5    MPG 2024  Ccesa007.pdf
Programacion Anual Matemática5 MPG 2024 Ccesa007.pdf
 
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
 
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
 
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
 
TIPOLOGÍA TEXTUAL- EXPOSICIÓN Y ARGUMENTACIÓN.pptx
TIPOLOGÍA TEXTUAL- EXPOSICIÓN Y ARGUMENTACIÓN.pptxTIPOLOGÍA TEXTUAL- EXPOSICIÓN Y ARGUMENTACIÓN.pptx
TIPOLOGÍA TEXTUAL- EXPOSICIÓN Y ARGUMENTACIÓN.pptx
 
BIOMETANO SÍ, PERO NO ASÍ. LA NUEVA BURBUJA ENERGÉTICA
BIOMETANO SÍ, PERO NO ASÍ. LA NUEVA BURBUJA ENERGÉTICABIOMETANO SÍ, PERO NO ASÍ. LA NUEVA BURBUJA ENERGÉTICA
BIOMETANO SÍ, PERO NO ASÍ. LA NUEVA BURBUJA ENERGÉTICA
 
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
 
Medición del Movimiento Online 2024.pptx
Medición del Movimiento Online 2024.pptxMedición del Movimiento Online 2024.pptx
Medición del Movimiento Online 2024.pptx
 
Qué es la Inteligencia artificial generativa
Qué es la Inteligencia artificial generativaQué es la Inteligencia artificial generativa
Qué es la Inteligencia artificial generativa
 
CALENDARIZACION DE MAYO / RESPONSABILIDAD
CALENDARIZACION DE MAYO / RESPONSABILIDADCALENDARIZACION DE MAYO / RESPONSABILIDAD
CALENDARIZACION DE MAYO / RESPONSABILIDAD
 
6.-Como-Atraer-El-Amor-01-Lain-Garcia-Calvo.pdf
6.-Como-Atraer-El-Amor-01-Lain-Garcia-Calvo.pdf6.-Como-Atraer-El-Amor-01-Lain-Garcia-Calvo.pdf
6.-Como-Atraer-El-Amor-01-Lain-Garcia-Calvo.pdf
 
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
 
SEXTO SEGUNDO PERIODO EMPRENDIMIENTO.pptx
SEXTO SEGUNDO PERIODO EMPRENDIMIENTO.pptxSEXTO SEGUNDO PERIODO EMPRENDIMIENTO.pptx
SEXTO SEGUNDO PERIODO EMPRENDIMIENTO.pptx
 

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