Div and Span
<div> and <span> are generic containers. They do not tell the browser that the content is a heading, article, navigation area, or other special meaning. <div> is commonly used as a block container. It can hold larger groups of content. <span> is commonly used inside a line of text when you need to target a small piece. Use semantic HTML when a meaningful element already exists. Use <div> and <span> when you really need a generic container for grouping or styling.
Why this matters
- ·Containers help organize code.
- ·They work well with CSS and JavaScript.
- ·They are useful when no more meaningful element fits.
Common mistakes
- ·Using div for everything loses useful meaning.
- ·Too many nested containers can make code difficult to read.
- ·A span should not replace a real semantic element when one exists.
Your codeHTML
Live preview
Frequently asked questions
A generic block container.
Practice questions
Question 1
Group a heading and paragraph inside a div.
Your codeHTML
Live preview
Question 2
Highlight one word with a span.
Your codeHTML
Live preview
Quick check
Just for this topic answer honestly, then check yourself.
1 / 3