Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Lära HTML Document Structure Explained | Section
HTML Basics for Absolute Beginners (Sliced) - 1768407373666

bookHTML Document Structure Explained

An HTML document follows a consistent structure made of a few key elements.

<html> tag

The root element of every page. All content goes inside the opening <html> and closing </html> tags.

<html>
  <!-- Other elements go here -->
</html>

<head> tag

Contains information about the page, not visible to the user. This includes the title, metadata, and links to stylesheets or scripts.

<head>
  <title>Title of the Document</title>
  <meta charset="UTF-8" />
  <!-- Other meta tags, links, and scripts go here -->
</head>

Common items in <head>:

  • <title>: text shown on the browser tab;
  • <meta charset="UTF-8">: sets text encoding;
  • <meta name="description">: short page description;
  • <meta name="viewport">: needed for responsive design.

<body> tag

Holds everything visible on the page: text, images, links, forms, etc.

<body>
  <h1>Hello, World!</h1>
  <p>This is a paragraph of text.</p>
  <!-- Other content goes here -->
</body>

Document type declaration

Tells the browser to use the HTML5 standard when rendering the page.

<!DOCTYPE html>

Full Structure Example

To wrap things up, let's gather all the elements we have considered and combine them into a single HTML document.

<!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>

Below, you can see how the HTML document appears in the web browser.

1. Which tag is the root element of an HTML document?

2. What does the <head> tag contain?

3. What does the <title> tag define?

4. What is the purpose of the <body> tag?

question mark

Which tag is the root element of an HTML document?

Select the correct answer

question mark

What does the <head> tag contain?

Select the correct answer

question mark

What does the <title> tag define?

Select the correct answer

question mark

What is the purpose of the <body> tag?

Select the correct answer

Var allt tydligt?

Hur kan vi förbättra det?

Tack för dina kommentarer!

Avsnitt 1. Kapitel 7

Fråga AI

expand

Fråga AI

ChatGPT

Fråga vad du vill eller prova någon av de föreslagna frågorna för att starta vårt samtal

bookHTML Document Structure Explained

Svep för att visa menyn

An HTML document follows a consistent structure made of a few key elements.

<html> tag

The root element of every page. All content goes inside the opening <html> and closing </html> tags.

<html>
  <!-- Other elements go here -->
</html>

<head> tag

Contains information about the page, not visible to the user. This includes the title, metadata, and links to stylesheets or scripts.

<head>
  <title>Title of the Document</title>
  <meta charset="UTF-8" />
  <!-- Other meta tags, links, and scripts go here -->
</head>

Common items in <head>:

  • <title>: text shown on the browser tab;
  • <meta charset="UTF-8">: sets text encoding;
  • <meta name="description">: short page description;
  • <meta name="viewport">: needed for responsive design.

<body> tag

Holds everything visible on the page: text, images, links, forms, etc.

<body>
  <h1>Hello, World!</h1>
  <p>This is a paragraph of text.</p>
  <!-- Other content goes here -->
</body>

Document type declaration

Tells the browser to use the HTML5 standard when rendering the page.

<!DOCTYPE html>

Full Structure Example

To wrap things up, let's gather all the elements we have considered and combine them into a single HTML document.

<!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>

Below, you can see how the HTML document appears in the web browser.

1. Which tag is the root element of an HTML document?

2. What does the <head> tag contain?

3. What does the <title> tag define?

4. What is the purpose of the <body> tag?

question mark

Which tag is the root element of an HTML document?

Select the correct answer

question mark

What does the <head> tag contain?

Select the correct answer

question mark

What does the <title> tag define?

Select the correct answer

question mark

What is the purpose of the <body> tag?

Select the correct answer

Var allt tydligt?

Hur kan vi förbättra det?

Tack för dina kommentarer!

Avsnitt 1. Kapitel 7
some-alt