๐ŸŽ“ A1Learner
๐Ÿ”

HTML Elements

An HTML element is a piece of content together with the tags that mark it. Most elements use an opening tag and a closing tag.

Opening and closing tags

The opening tag starts the element. The closing tag ends it.

<p>Hello there.</p>

One element inside another

The paragraph sits inside the body. The body sits inside the html element.

<body>
<p>Nested content.</p>
</body>

An empty element

The br element breaks a line. It has no content and no closing tag.

<p>First line.<br>Second line.</p>

Example

<!DOCTYPE html>
<html>
<head>
<title>City Park</title>
</head>
<body>
<h1>City Park</h1>
<p>The park opens at dawn.</p>
<p>Gates close at dusk.<br>Entry is free.</p>
</body>
</html>

Key points

  • Opening tag: the first tag of an element, like <p>
  • Closing tag: the last tag of an element, like </p>
  • Nesting: placing one element inside another element
  • Empty element: an element with no content and no closing tag
  • An element includes its opening tag, its content, and its closing tag.

In this example, the body holds a heading and two paragraphs. Each paragraph uses an opening tag and a closing tag. The second paragraph holds a br element. The br element breaks the line after the first sentence. It has no closing tag.

Note

A closing tag always includes a forward slash.

Try it Yourself

Edit the code, then press Run.

Runs in your browser โ€” the preview under the editor is the real result. Nothing is sent to a server. The code runner panel (right) does the same with more room.

Exercise

Which tag closes a paragraph element?