Elements and Tags

What this is. An element is a piece of content plus the markup that describes it. Most elements are written with an opening tag, some content, and a closing tag.

<p>This is a paragraph.</p>

A few elements have no content at all. These are void elements, and they have no closing tag: <img>, <br>, <meta>, <input>.

Why nesting order matters. Elements can contain other elements, which is how a document gets its structure. But the nesting has to close in the reverse order it opened, exactly like brackets in arithmetic. <p><strong>text</strong></p> is valid. <p><strong>text</p></strong> is not, and browsers will silently guess at what you meant, which is worse than an error because you will not notice.

LIVE PREVIEW
loading editor…

Your turn → Nest an <em> inside the <strong> in the second paragraph. Then try closing them in the wrong order and see that the browser quietly recovers rather than telling you.

✦ strong and em are not bold and italic

b and i describe appearance. strong and em describe importance and emphasis, which is why a screen reader can change its intonation for them. If you only want thicker letters, that is a CSS decision. If you mean this word matters, that is an HTML decision.

Mark this lesson complete

Signed in, your progress follows you to every device.

Next: Attributes: Configuring an Element →
← Back