<span>

The <span> element is used for grouping text or elements together for styling and scripting. Unlike the block-level <div> element, <span> is an inline element that is usually wrapped inside another element. (<li>, <p>, etc.)

This element should only be used whenever there is no semantic element to use instead.

Syntax

<span attributes=""><!-- Place content here. --></span>

The <span> element can be selected with attributes, such as class or style.

Example

In the example below, a familiar poem is marked up with <span> wrapped in a single <p> element:

<p>
Roses are <span style="color: red;">Red</span>,<br />
Violets are <span style="color: blue;">Blue</span>,<br />
We think HTML is <span style="color: orange">awesome</span>!<br />
What about <span style="text-decoration: underline;">you</span>?
</p>

Rendered markup with styled span tags.

Edit this page on GitHub

Contributors

Interested in helping build Docs? Read the Contribution Guide or share your feedback form.

Learn HTML on Codecademy