<span> elementThe <span> element is a generic container for phrasing content, such as text, emphasised words, links, and inline images. It has no special meaning of its own and is useful for grouping a short passage when no more specific element is suitable.
The global attributes class and id can identify the enclosed content for CSS or JavaScript. Other attributes describe the content itself: lang identifies its language, and dir specifies its text direction. In the example below, lang="fr" identifies a French phrase within an English paragraph. This can help a speech synthesiser choose the appropriate pronunciation, although it does not give the phrase a special visual appearance.
Where the text has a particular meaning, a more specific element can express it: <strong> marks importance, <em> marks stress emphasis, and <code> marks computer code. A <span> is appropriate when the grouping itself has no such meaning.
The element is inline by default, so its contents remain within the surrounding line of text. The related <div> element groups flow content and has a block layout by default. CSS can change either element's display, but a <span> must still contain phrasing content; styling it as a block does not allow it to contain paragraphs or lists.
Attributes: GLOBALS.
Typical layout: <p>In French, <span lang="fr">bonjour</span> means hello.</p>
Visual representation:
In French, bonjour means hello.