HTML Elements
An HTML element is defined by a start tag, some content, and an end tag.
Elements are the building blocks of every page. Each one wraps a piece of content and tells the browser what that content is.
Anatomy of an Element
The pattern is always the same: a start tag, the content, then a matching end tag with a slash: <tagname>Content goes here...</tagname>.
Note: A few elements, like <br> for a line break and <img> for an image, have no content and no end tag. These are called empty elements.
Nested HTML Elements
Elements can contain other elements, which is how a page gains structure. Here the <html> element holds a <body>, which holds a heading and a paragraph.
Example
<!DOCTYPE html>
<html>
<body>
<h1>My First Heading</h1>
<p>My first paragraph.</p>
</body>
</html>Do Not Forget the End Tag
Some browsers still display a page correctly if you forget an end tag, but you should never rely on it. A missing end tag can produce surprising results.
Missing end tag
<!DOCTYPE html>
<html>
<body>
<p>This is a paragraph
<p>This is another paragraph
</body>
</html>Note: Always close nested elements in the reverse order you opened them: close the inner element before the outer one.
Exercise: HTML Elements
What makes up a complete HTML element?
