: The SPAN Element

Last updated: 2026-09-12

<span>The SPAN Element

The <span> element is a generic inline container with no semantic meaning. It's used to style a portion of text or as a JavaScript hook without causing line breaks.

CategoryText Content
Content ModelPhrasing content
Allowed ParentsAny element that accepts phrasing content
Content TagYes — requires closing </span> tag
StatusStandard

📝 Syntax

<span>Inline content</span>

▶ Example

Edit the code below and see the live result in the playground:

🌐 Browser Support

Browser ChromeChrome EdgeEdge FirefoxFirefox SafariSafari OperaOpera
<span> v1 v12 v1 v1 v1
Supported in all major browsers

❓ FAQ

QWhat is the difference between and
?
A<div> is a block-level element (takes full width, starts on a new line), while <span> is inline (only takes as much width as needed, stays in line with text).
QCan contain block elements?
ANo, <span> is inline and cannot legally contain block-level elements like <div>, <p>, or headings. Use <div> or a semantic container if you need block-level content.
QWhen should I use instead of or ?
AUse <em> for emphasis (semantic, affects screen readers), <strong> for strong importance, and <span> only when you need a generic inline hook for CSS styling without semantic meaning.

📚 Related Tutorials

Web-Tutorial.com

Web-Tutorial Tech Team

A team of developers maintaining programming tutorials. Each tutorial is written and reviewed by developers with expertise in that field. We work to keep our content accurate and reliable — if you spot an issue, please let us know.

100%

🙏 帮我们做得更好

我们是刚上线的编程教程站,几个人的小团队,精力有限。页面虽经检查,难免还有疏漏——链接失效、排版错乱、内容有误、语言生硬……

如果您发现了,麻烦告诉我们,我们会在收到反馈后第一时间进行修复,再次感谢您的光临 🙏