Estructura del Documento HTML Explicada
Un documento HTML sigue una estructura consistente compuesta por algunos elementos clave.
Etiqueta <html>
El elemento raíz de cada página. Todo el contenido va dentro de las etiquetas de apertura <html> y cierre </html>.
<html>
<!-- Other elements go here -->
</html>
Etiqueta <head>
Contiene información sobre la página, no visible para el usuario. Esto incluye el título, metadatos y enlaces a hojas de estilo o scripts.
<head>
<title>Title of the Document</title>
<meta charset="UTF-8" />
<!-- Other meta tags, links, and scripts go here -->
</head>
Elementos comunes en <head>:
<title>: texto mostrado en la pestaña del navegador;<meta charset="UTF-8">: define la codificación de texto;<meta name="description">: breve descripción de la página;<meta name="viewport">: necesario para diseño adaptable.
Etiqueta <body>
Contiene todo lo visible en la página: texto, imágenes, enlaces, formularios, etc.
<body>
<h1>Hello, World!</h1>
<p>This is a paragraph of text.</p>
<!-- Other content goes here -->
</body>
Declaración del tipo de documento
Indica al navegador que debe utilizar el estándar HTML5 al renderizar la página.
<!DOCTYPE html>
Ejemplo de estructura completa
Para finalizar, se reúnen todos los elementos considerados y se combinan en un solo documento HTML.
<!DOCTYPE html>
<html>
<head>
<title>Title of the Document</title>
<meta charset="UTF-8" />
<!-- Other meta tags, links, and scripts go here -->
</head>
<body>
<h1>Hello, World!</h1>
<p>This is a paragraph of text.</p>
<!-- Other content goes here -->
</body>
</html>
A continuación, puedes ver cómo aparece el documento HTML en el navegador web.
1. ¿Cuál etiqueta es el elemento raíz de un documento HTML?
2. ¿Qué contiene la etiqueta <head>?
3. ¿Qué define la etiqueta <title>?
4. ¿Cuál es el propósito de la etiqueta <body>?
¡Gracias por tus comentarios!
Pregunte a AI
Pregunte a AI
Pregunte lo que quiera o pruebe una de las preguntas sugeridas para comenzar nuestra charla
Can you explain more about the purpose of each HTML tag?
How do I use the Inspect tool in my browser?
What are some common mistakes to avoid when creating an HTML document?
Genial!
Completion tasa mejorada a 2.86Estructura del Documento HTML Explicada
Desliza para mostrar el menú
Un documento HTML sigue una estructura consistente compuesta por algunos elementos clave.
Etiqueta <html>
El elemento raíz de cada página. Todo el contenido va dentro de las etiquetas de apertura <html> y cierre </html>.
<html>
<!-- Other elements go here -->
</html>
Etiqueta <head>
Contiene información sobre la página, no visible para el usuario. Esto incluye el título, metadatos y enlaces a hojas de estilo o scripts.
<head>
<title>Title of the Document</title>
<meta charset="UTF-8" />
<!-- Other meta tags, links, and scripts go here -->
</head>
Elementos comunes en <head>:
<title>: texto mostrado en la pestaña del navegador;<meta charset="UTF-8">: define la codificación de texto;<meta name="description">: breve descripción de la página;<meta name="viewport">: necesario para diseño adaptable.
Etiqueta <body>
Contiene todo lo visible en la página: texto, imágenes, enlaces, formularios, etc.
<body>
<h1>Hello, World!</h1>
<p>This is a paragraph of text.</p>
<!-- Other content goes here -->
</body>
Declaración del tipo de documento
Indica al navegador que debe utilizar el estándar HTML5 al renderizar la página.
<!DOCTYPE html>
Ejemplo de estructura completa
Para finalizar, se reúnen todos los elementos considerados y se combinan en un solo documento HTML.
<!DOCTYPE html>
<html>
<head>
<title>Title of the Document</title>
<meta charset="UTF-8" />
<!-- Other meta tags, links, and scripts go here -->
</head>
<body>
<h1>Hello, World!</h1>
<p>This is a paragraph of text.</p>
<!-- Other content goes here -->
</body>
</html>
A continuación, puedes ver cómo aparece el documento HTML en el navegador web.
1. ¿Cuál etiqueta es el elemento raíz de un documento HTML?
2. ¿Qué contiene la etiqueta <head>?
3. ¿Qué define la etiqueta <title>?
4. ¿Cuál es el propósito de la etiqueta <body>?
¡Gracias por tus comentarios!
