SlideShare una empresa de Scribd logo
31/3/2020 2.3 Estructura del documento | 2.3 Estructura del documento
file:///C:/Users/Alumno/Desktop/rgalangLOCAL/Descargables/HTML_CSS_JS/02_HTML_Introduccion_al_lenguaje/2_3_Estructura_del_docume… 1/3
2.3 Estructura del documento
2.3 Estructura del documento
2.3 Estructura del documento
2.3 Estructura del documento
La estructura básica de un documento HTML bien construido debe comenzar con la
declaración del tipo de documento, Document Type Declaration o doctype, que es el medio
por el que le indicamos al navegador qué versión de HTML vamos a utilizar. Con HTML5, que
es la versión que emplearemos a lo largo de todo el curso, simplemente indicaremos:
https://codepen.io/CRFPTIC/embed/GRRWaNb?height=135&theme-id=dark&default-
tab=html&user=CRFPTIC&slug-hash=GRRWaNb&pen-title=1012&name=cp_embed_1
See the Pen
Existen otros valores para el tipo de documento, dependiendo de la versión de HTML que
empleemos para escribir el código:
HTML 4.01 Strict
https://codepen.io/CRFPTIC/embed/OJJpYpJ?height=135&theme-id=dark&default-
tab=html&user=CRFPTIC&slug-hash=OJJpYpJ&pen-title=1013&name=cp_embed_2
See the Pen
HTML 4.01 Transitional
https://codepen.io/CRFPTIC/embed/MWWpdpm?height=135&theme-id=dark&default-
tab=html&user=CRFPTIC&slug-hash=MWWpdpm&pen-title=1014&name=cp_embed_3
<!DOCTYPE html>
Resources
HTML
E D I T O N
Result
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
Resources
HTML
E D I T O N
Result
31/3/2020 2.3 Estructura del documento | 2.3 Estructura del documento
file:///C:/Users/Alumno/Desktop/rgalangLOCAL/Descargables/HTML_CSS_JS/02_HTML_Introduccion_al_lenguaje/2_3_Estructura_del_docume… 2/3
See the Pen
HTML 4.01 Frameset
https://codepen.io/CRFPTIC/embed/RwwpmpO?height=135&theme-id=dark&default-
tab=html&user=CRFPTIC&slug-hash=RwwpmpO&pen-title=1015&name=cp_embed_4
See the Pen
A continuación aparecerá la etiqueta HTML que encierra todo el contenido de la página:
https://codepen.io/CRFPTIC/embed/wvvJbda?height=165&theme-id=dark&default-
tab=html&user=CRFPTIC&slug-hash=wvvJbda&pen-title=1016&name=cp_embed_5
See the Pen
La etiqueta de cierre del elemento html siempre aparecerá al nal del documento. No debe
escribirse nada tras ella.
Dentro del elemento html construiremos siempre otros dos elementos ‘hijos’: head y body.
El elemento head se empleará para proporcionar información al navegador sobre la página.
Son los metadatos de la web y no se mostrarán dentro del documento. El elemento body
albergará el contenido visible del sitio. La estructura quedaría así:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
Resources
HTML
E D I T O N
Result
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">
Resources
HTML
E D I T O N
Result
<!DOCTYPE html>
<html>
[...]
</html>
Resources
HTML
E D I T O N
Result
31/3/2020 2.3 Estructura del documento | 2.3 Estructura del documento
file:///C:/Users/Alumno/Desktop/rgalangLOCAL/Descargables/HTML_CSS_JS/02_HTML_Introduccion_al_lenguaje/2_3_Estructura_del_docume… 3/3
Obra publicada con Licencia Creative Commons Reconocimiento Compartir igual 4.0
https://codepen.io/CRFPTIC/embed/jOOBowV?height=265&theme-id=dark&default-
tab=html&user=CRFPTIC&slug-hash=jOOBowV&pen-title=1017&name=cp_embed_6
See the Pen
Hay que tener en cuenta que en CodePen no es necesario incluir las etiquetas html, head ni
body. Solo incluiremos el contenido del elemento body.
<!DOCTYPE html>
<html>
<head>
[...]
</head>
<body>
[...]
</body>
</html>
Resources
HTML
E D I T O N
Result

Más contenido relacionado

Similar a 2_3_Estructura_del_documento.pdf

Html geraly fernanda cabrera aldana
Html geraly fernanda cabrera aldanaHtml geraly fernanda cabrera aldana
Html geraly fernanda cabrera aldana
geralyfernandacabreraaldana
 
Etiquetas del html
Etiquetas del htmlEtiquetas del html
Etiquetas del html
hurtadoguilcazo
 
HTML
HTMLHTML
Manual intencivo de htlm
Manual intencivo de htlmManual intencivo de htlm
Manual intencivo de htlm
Omar Ari
 
2_4_Los_metadatos_El_elemento_head.pdf
2_4_Los_metadatos_El_elemento_head.pdf2_4_Los_metadatos_El_elemento_head.pdf
2_4_Los_metadatos_El_elemento_head.pdf
Mariano Suárez Guerrero
 
3 septimo
3 septimo3 septimo
3 septimo
sotocarlos
 
Html5
Html5Html5
Php curso02
Php   curso02Php   curso02
Php curso02
viruscraquer
 
XHTML
XHTMLXHTML
05introduccionhtml 100901142734-phpapp02
05introduccionhtml 100901142734-phpapp0205introduccionhtml 100901142734-phpapp02
05introduccionhtml 100901142734-phpapp02
SoftArt2014
 
Html
HtmlHtml
Narrativa pagina-web-welinton-burgos
Narrativa pagina-web-welinton-burgosNarrativa pagina-web-welinton-burgos
Narrativa pagina-web-welinton-burgos
moraleswbm
 
Practico html
Practico htmlPractico html
Practico html
Lautaro Lopez
 
Practico html
Practico htmlPractico html
Practico html
lucascen
 
Trabajo practico 2
Trabajo practico 2Trabajo practico 2
Trabajo practico 2
Tomi Mirra
 
HTML
HTMLHTML
sesion 01- HTML5
sesion 01- HTML5sesion 01- HTML5
Introducción a HTML5
Introducción a HTML5Introducción a HTML5
Introducción a HTML5
maxfontana90
 
4 Html
4 Html4 Html
4 Html
Ergoclicks
 
C2 lenguaje html
C2 lenguaje htmlC2 lenguaje html
C2 lenguaje html
Alejandro Hernandez
 

Similar a 2_3_Estructura_del_documento.pdf (20)

Html geraly fernanda cabrera aldana
Html geraly fernanda cabrera aldanaHtml geraly fernanda cabrera aldana
Html geraly fernanda cabrera aldana
 
Etiquetas del html
Etiquetas del htmlEtiquetas del html
Etiquetas del html
 
HTML
HTMLHTML
HTML
 
Manual intencivo de htlm
Manual intencivo de htlmManual intencivo de htlm
Manual intencivo de htlm
 
2_4_Los_metadatos_El_elemento_head.pdf
2_4_Los_metadatos_El_elemento_head.pdf2_4_Los_metadatos_El_elemento_head.pdf
2_4_Los_metadatos_El_elemento_head.pdf
 
3 septimo
3 septimo3 septimo
3 septimo
 
Html5
Html5Html5
Html5
 
Php curso02
Php   curso02Php   curso02
Php curso02
 
XHTML
XHTMLXHTML
XHTML
 
05introduccionhtml 100901142734-phpapp02
05introduccionhtml 100901142734-phpapp0205introduccionhtml 100901142734-phpapp02
05introduccionhtml 100901142734-phpapp02
 
Html
HtmlHtml
Html
 
Narrativa pagina-web-welinton-burgos
Narrativa pagina-web-welinton-burgosNarrativa pagina-web-welinton-burgos
Narrativa pagina-web-welinton-burgos
 
Practico html
Practico htmlPractico html
Practico html
 
Practico html
Practico htmlPractico html
Practico html
 
Trabajo practico 2
Trabajo practico 2Trabajo practico 2
Trabajo practico 2
 
HTML
HTMLHTML
HTML
 
sesion 01- HTML5
sesion 01- HTML5sesion 01- HTML5
sesion 01- HTML5
 
Introducción a HTML5
Introducción a HTML5Introducción a HTML5
Introducción a HTML5
 
4 Html
4 Html4 Html
4 Html
 
C2 lenguaje html
C2 lenguaje htmlC2 lenguaje html
C2 lenguaje html
 

Último

Uso de equipos de protección personal.pptx
Uso de equipos de protección personal.pptxUso de equipos de protección personal.pptx
Uso de equipos de protección personal.pptx
OmarPadillaGarcia
 
Operaciones Básicas creadora Veronica Maiz
Operaciones Básicas creadora Veronica MaizOperaciones Básicas creadora Veronica Maiz
Operaciones Básicas creadora Veronica Maiz
carolina838317
 
AE 34 Serie de sobrecargas aisladas_240429_172040.pdf
AE  34 Serie de sobrecargas aisladas_240429_172040.pdfAE  34 Serie de sobrecargas aisladas_240429_172040.pdf
AE 34 Serie de sobrecargas aisladas_240429_172040.pdf
sebastianpech108
 
Infografía operaciones básicas construcción .pdf
Infografía operaciones básicas construcción .pdfInfografía operaciones básicas construcción .pdf
Infografía operaciones básicas construcción .pdf
Carlos Pulido
 
tipos de energias: la Energía Radiante.pdf
tipos de energias: la Energía Radiante.pdftipos de energias: la Energía Radiante.pdf
tipos de energias: la Energía Radiante.pdf
munozvanessa878
 
PPT suelos ensayo Proctor - laboratorio 4.pdf
PPT suelos ensayo Proctor - laboratorio 4.pdfPPT suelos ensayo Proctor - laboratorio 4.pdf
PPT suelos ensayo Proctor - laboratorio 4.pdf
EgorRamos1
 
METODOLOGIA DE TRAZO Y REPLANTEO EN TOPOGRAFIA
METODOLOGIA DE TRAZO Y REPLANTEO EN TOPOGRAFIAMETODOLOGIA DE TRAZO Y REPLANTEO EN TOPOGRAFIA
METODOLOGIA DE TRAZO Y REPLANTEO EN TOPOGRAFIA
LuisCiriacoMolina
 
muros de contencion, diseño y generalidades
muros de contencion, diseño y generalidadesmuros de contencion, diseño y generalidades
muros de contencion, diseño y generalidades
AlejandroArturoGutie1
 
Dosificacion de hormigon NCH 170 actualizada
Dosificacion de hormigon NCH 170 actualizadaDosificacion de hormigon NCH 170 actualizada
Dosificacion de hormigon NCH 170 actualizada
pipex55
 
Cálculo del espesor del conducto forzado
Cálculo del espesor del conducto forzadoCálculo del espesor del conducto forzado
Cálculo del espesor del conducto forzado
KristianSaavedra
 
SISTEMA AUTOMATIZADO DE LIMPIEZA PARA ACUARIOS
SISTEMA AUTOMATIZADO DE LIMPIEZA PARA ACUARIOSSISTEMA AUTOMATIZADO DE LIMPIEZA PARA ACUARIOS
SISTEMA AUTOMATIZADO DE LIMPIEZA PARA ACUARIOS
micoltadaniel2024
 
Infografía de operaciones básicas....pdf
Infografía de operaciones básicas....pdfInfografía de operaciones básicas....pdf
Infografía de operaciones básicas....pdf
jahirrtorresa
 
INGLES_LISTA_DE_VOCABULARIO una lista completa
INGLES_LISTA_DE_VOCABULARIO una lista completaINGLES_LISTA_DE_VOCABULARIO una lista completa
INGLES_LISTA_DE_VOCABULARIO una lista completa
JaimmsArthur
 
Cargas de Cálculos Estructurales de un Puente
Cargas de Cálculos Estructurales de un PuenteCargas de Cálculos Estructurales de un Puente
Cargas de Cálculos Estructurales de un Puente
jemifermelgarejoaran1
 
Informe Municipal provincial de la ciudad de Tacna
Informe Municipal provincial de la ciudad de TacnaInforme Municipal provincial de la ciudad de Tacna
Informe Municipal provincial de la ciudad de Tacna
BrusCiriloPintoApaza
 
Ducto Barras para instalaciones electricas
Ducto Barras para instalaciones electricasDucto Barras para instalaciones electricas
Ducto Barras para instalaciones electricas
Edgar Najera
 
SLIDEHARE.docx..........................
SLIDEHARE.docx..........................SLIDEHARE.docx..........................
SLIDEHARE.docx..........................
azulsarase
 
PRIMERA Y SEGUNDA LEY DE LA TERMODINÁMICA
PRIMERA Y SEGUNDA LEY DE LA TERMODINÁMICAPRIMERA Y SEGUNDA LEY DE LA TERMODINÁMICA
PRIMERA Y SEGUNDA LEY DE LA TERMODINÁMICA
carmenquintana18
 
S09 PBM-HEMORRAGIAS 2021-I Grabada 1.pptx
S09 PBM-HEMORRAGIAS 2021-I Grabada 1.pptxS09 PBM-HEMORRAGIAS 2021-I Grabada 1.pptx
S09 PBM-HEMORRAGIAS 2021-I Grabada 1.pptx
yamilbailonw
 
PRACTICA 2 EDAFOLOGÍA TEXTURA DEL SUELO.pptx
PRACTICA 2 EDAFOLOGÍA TEXTURA DEL SUELO.pptxPRACTICA 2 EDAFOLOGÍA TEXTURA DEL SUELO.pptx
PRACTICA 2 EDAFOLOGÍA TEXTURA DEL SUELO.pptx
ANGELJOELSILVAPINZN
 

Último (20)

Uso de equipos de protección personal.pptx
Uso de equipos de protección personal.pptxUso de equipos de protección personal.pptx
Uso de equipos de protección personal.pptx
 
Operaciones Básicas creadora Veronica Maiz
Operaciones Básicas creadora Veronica MaizOperaciones Básicas creadora Veronica Maiz
Operaciones Básicas creadora Veronica Maiz
 
AE 34 Serie de sobrecargas aisladas_240429_172040.pdf
AE  34 Serie de sobrecargas aisladas_240429_172040.pdfAE  34 Serie de sobrecargas aisladas_240429_172040.pdf
AE 34 Serie de sobrecargas aisladas_240429_172040.pdf
 
Infografía operaciones básicas construcción .pdf
Infografía operaciones básicas construcción .pdfInfografía operaciones básicas construcción .pdf
Infografía operaciones básicas construcción .pdf
 
tipos de energias: la Energía Radiante.pdf
tipos de energias: la Energía Radiante.pdftipos de energias: la Energía Radiante.pdf
tipos de energias: la Energía Radiante.pdf
 
PPT suelos ensayo Proctor - laboratorio 4.pdf
PPT suelos ensayo Proctor - laboratorio 4.pdfPPT suelos ensayo Proctor - laboratorio 4.pdf
PPT suelos ensayo Proctor - laboratorio 4.pdf
 
METODOLOGIA DE TRAZO Y REPLANTEO EN TOPOGRAFIA
METODOLOGIA DE TRAZO Y REPLANTEO EN TOPOGRAFIAMETODOLOGIA DE TRAZO Y REPLANTEO EN TOPOGRAFIA
METODOLOGIA DE TRAZO Y REPLANTEO EN TOPOGRAFIA
 
muros de contencion, diseño y generalidades
muros de contencion, diseño y generalidadesmuros de contencion, diseño y generalidades
muros de contencion, diseño y generalidades
 
Dosificacion de hormigon NCH 170 actualizada
Dosificacion de hormigon NCH 170 actualizadaDosificacion de hormigon NCH 170 actualizada
Dosificacion de hormigon NCH 170 actualizada
 
Cálculo del espesor del conducto forzado
Cálculo del espesor del conducto forzadoCálculo del espesor del conducto forzado
Cálculo del espesor del conducto forzado
 
SISTEMA AUTOMATIZADO DE LIMPIEZA PARA ACUARIOS
SISTEMA AUTOMATIZADO DE LIMPIEZA PARA ACUARIOSSISTEMA AUTOMATIZADO DE LIMPIEZA PARA ACUARIOS
SISTEMA AUTOMATIZADO DE LIMPIEZA PARA ACUARIOS
 
Infografía de operaciones básicas....pdf
Infografía de operaciones básicas....pdfInfografía de operaciones básicas....pdf
Infografía de operaciones básicas....pdf
 
INGLES_LISTA_DE_VOCABULARIO una lista completa
INGLES_LISTA_DE_VOCABULARIO una lista completaINGLES_LISTA_DE_VOCABULARIO una lista completa
INGLES_LISTA_DE_VOCABULARIO una lista completa
 
Cargas de Cálculos Estructurales de un Puente
Cargas de Cálculos Estructurales de un PuenteCargas de Cálculos Estructurales de un Puente
Cargas de Cálculos Estructurales de un Puente
 
Informe Municipal provincial de la ciudad de Tacna
Informe Municipal provincial de la ciudad de TacnaInforme Municipal provincial de la ciudad de Tacna
Informe Municipal provincial de la ciudad de Tacna
 
Ducto Barras para instalaciones electricas
Ducto Barras para instalaciones electricasDucto Barras para instalaciones electricas
Ducto Barras para instalaciones electricas
 
SLIDEHARE.docx..........................
SLIDEHARE.docx..........................SLIDEHARE.docx..........................
SLIDEHARE.docx..........................
 
PRIMERA Y SEGUNDA LEY DE LA TERMODINÁMICA
PRIMERA Y SEGUNDA LEY DE LA TERMODINÁMICAPRIMERA Y SEGUNDA LEY DE LA TERMODINÁMICA
PRIMERA Y SEGUNDA LEY DE LA TERMODINÁMICA
 
S09 PBM-HEMORRAGIAS 2021-I Grabada 1.pptx
S09 PBM-HEMORRAGIAS 2021-I Grabada 1.pptxS09 PBM-HEMORRAGIAS 2021-I Grabada 1.pptx
S09 PBM-HEMORRAGIAS 2021-I Grabada 1.pptx
 
PRACTICA 2 EDAFOLOGÍA TEXTURA DEL SUELO.pptx
PRACTICA 2 EDAFOLOGÍA TEXTURA DEL SUELO.pptxPRACTICA 2 EDAFOLOGÍA TEXTURA DEL SUELO.pptx
PRACTICA 2 EDAFOLOGÍA TEXTURA DEL SUELO.pptx
 

2_3_Estructura_del_documento.pdf

  • 1. 31/3/2020 2.3 Estructura del documento | 2.3 Estructura del documento file:///C:/Users/Alumno/Desktop/rgalangLOCAL/Descargables/HTML_CSS_JS/02_HTML_Introduccion_al_lenguaje/2_3_Estructura_del_docume… 1/3 2.3 Estructura del documento 2.3 Estructura del documento 2.3 Estructura del documento 2.3 Estructura del documento La estructura básica de un documento HTML bien construido debe comenzar con la declaración del tipo de documento, Document Type Declaration o doctype, que es el medio por el que le indicamos al navegador qué versión de HTML vamos a utilizar. Con HTML5, que es la versión que emplearemos a lo largo de todo el curso, simplemente indicaremos: https://codepen.io/CRFPTIC/embed/GRRWaNb?height=135&theme-id=dark&default- tab=html&user=CRFPTIC&slug-hash=GRRWaNb&pen-title=1012&name=cp_embed_1 See the Pen Existen otros valores para el tipo de documento, dependiendo de la versión de HTML que empleemos para escribir el código: HTML 4.01 Strict https://codepen.io/CRFPTIC/embed/OJJpYpJ?height=135&theme-id=dark&default- tab=html&user=CRFPTIC&slug-hash=OJJpYpJ&pen-title=1013&name=cp_embed_2 See the Pen HTML 4.01 Transitional https://codepen.io/CRFPTIC/embed/MWWpdpm?height=135&theme-id=dark&default- tab=html&user=CRFPTIC&slug-hash=MWWpdpm&pen-title=1014&name=cp_embed_3 <!DOCTYPE html> Resources HTML E D I T O N Result <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> Resources HTML E D I T O N Result
  • 2. 31/3/2020 2.3 Estructura del documento | 2.3 Estructura del documento file:///C:/Users/Alumno/Desktop/rgalangLOCAL/Descargables/HTML_CSS_JS/02_HTML_Introduccion_al_lenguaje/2_3_Estructura_del_docume… 2/3 See the Pen HTML 4.01 Frameset https://codepen.io/CRFPTIC/embed/RwwpmpO?height=135&theme-id=dark&default- tab=html&user=CRFPTIC&slug-hash=RwwpmpO&pen-title=1015&name=cp_embed_4 See the Pen A continuación aparecerá la etiqueta HTML que encierra todo el contenido de la página: https://codepen.io/CRFPTIC/embed/wvvJbda?height=165&theme-id=dark&default- tab=html&user=CRFPTIC&slug-hash=wvvJbda&pen-title=1016&name=cp_embed_5 See the Pen La etiqueta de cierre del elemento html siempre aparecerá al nal del documento. No debe escribirse nada tras ella. Dentro del elemento html construiremos siempre otros dos elementos ‘hijos’: head y body. El elemento head se empleará para proporcionar información al navegador sobre la página. Son los metadatos de la web y no se mostrarán dentro del documento. El elemento body albergará el contenido visible del sitio. La estructura quedaría así: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> Resources HTML E D I T O N Result <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd"> Resources HTML E D I T O N Result <!DOCTYPE html> <html> [...] </html> Resources HTML E D I T O N Result
  • 3. 31/3/2020 2.3 Estructura del documento | 2.3 Estructura del documento file:///C:/Users/Alumno/Desktop/rgalangLOCAL/Descargables/HTML_CSS_JS/02_HTML_Introduccion_al_lenguaje/2_3_Estructura_del_docume… 3/3 Obra publicada con Licencia Creative Commons Reconocimiento Compartir igual 4.0 https://codepen.io/CRFPTIC/embed/jOOBowV?height=265&theme-id=dark&default- tab=html&user=CRFPTIC&slug-hash=jOOBowV&pen-title=1017&name=cp_embed_6 See the Pen Hay que tener en cuenta que en CodePen no es necesario incluir las etiquetas html, head ni body. Solo incluiremos el contenido del elemento body. <!DOCTYPE html> <html> <head> [...] </head> <body> [...] </body> </html> Resources HTML E D I T O N Result