HTML <span> tag is used as a generic container of inline elements. It is used for styling purpose to the grouped inline elements (using class and id attribute or inline style).
The <span> tag does not have any default meaning or rendering.
The <span> tag can be useful for the following task:
- To change the language of a part of the text.
- To change the color, font, background of a part of text using CSS
- To apply the scripts to the particular part of the text.
Note: HTML <span> is much similar as <div> tag, but <div> is used for block-level elements and <span> tag is used for inline elements.
Syntax
<span>Write your content here......</span> Following are some specifications about the HTML <span> tag
| Display | Inline |
| Start tag/End tag | Both Start and End tag |
| Usage | Styles and semantics |
Example
<!DOCTYPE html>
<html>
<head>
<title>Span Tag</title>
</head>
<body>
<h2>Example of span tag</h2>
<p>I have choosen only
<span style="color: red;">red</span>,
<span style="color: blue;">blue</span>, and
<span style="color: green;">green</span> colors for my painting.
</p>
</body>
</html>Output:
Attribute:
Tag-specific attributes:
The <span> tag does not contain any specific attribute in HTML.
Global attribute:
The <span> tag supports the Global attributes in HTML.
Event attribute:
The <span> tag supports the Event attributes in HTML.
Supporting Browsers
| Element |  Chrome |  IE |  Firefox |  Opera |  Safari |
| <span> | Yes | Yes | Yes | Yes | Yes |
Leave a Reply