<span>

The <span> tag is an HTML inline tag (which does not cause a line break) that allows you to style or select a portion of text or a group of elements without affecting the document structure or overall layout.

It is primarily used to apply CSS styles or manipulations with JavaScript to specific parts of the text without consequences on the order of elements on the page.

Structure and syntax of the <span> tag

Basic structure and syntax

The <span> tag is a container tag, which means it does not modify the layout of the surrounding text. It has:

• An opening tag: <span>;
• A closing tag: </span>.

Usage example

Here is an example of using the <span> tag:

<p>Here is a text with a word highlighted <span style="color: red;">highlighted</span> thanks to the <span> tag.</p>

In this example, the word "highlighted" will be displayed in red, while the rest of the text remains unchanged.

Attributes

The <span> tag can accept classic HTML attributes, such as title, class, id, style.

Difference with other similar tags

• <bdo>: Unlike <span>, the <bdo> tag is used to force the direction of the text, regardless of the default direction.
• <bdi>: <bdi> is used to isolate text whose direction needs to be managed independently, whereas <span> does not change the directionality.

Browser compatibility

The <span> tag is supported by all modern browsers.