Elements & Tags
How opening tags, closing tags, and content come together.
1Anatomy of an Element
An HTML element is made of an opening tag, content, and a closing tag. Some elements are "void" (self-closing) like <img> and <br>.
<!-- Normal element -->
<p>Hello world</p>
<!-- Void elements (no closing tag) -->
<br />
<img src="cat.jpg" alt="A cat" />2Put the element in context
A tag is part of the syntax that marks an element; the element includes its attributes and content in the resulting document. Some elements are void and do not wrap content. Proper nesting matters because a browser may repair malformed markup into a structure you did not intend.
3Practice with a small page
Build a paragraph containing an emphasized phrase and a link. Inspect the DOM in developer tools, then deliberately misnest a pair of tags and compare the repaired structure. Restore valid nesting before using the document as a template.
Finished reading?
Mark this topic as complete to track progress.