HTML span Tag
The span tag can be thought of as an inline container for some part of a document or some text. Using the span tag, we can easily style the content with CSS, or can also be manipulated using JavaScript, using some class or id attributes here. Other than this, the span tag has no special meaning. It is just a generic inline container, which can be used to contain the elements for styling purposes.
Well, this tag is similar to the div tag (Which we are going to see ahead), with the difference that the div tag is a block element, and the span is an inline element.
Here is the code for using the span tag →
<!DOCTYPE html>
<html lang=”en”>
<head>
<meta charset=”UTF-8″>
<meta http-equiv=”X-UA-Compatible” content=”IE=edge”>
<meta name=”viewport” content=”width=device-width, initial-scale=1.0″>
<title>Some heading…</title>
</head>
<body>
<span>Hello… i am a span</span>
<span>Hello… I am another span</span>
</body>
</html>
If we try to open the file in the browser, the output is something like this –
As you can see, the content is now side by side. The reason is that the span element is an inline element, which means that it takes up the space it requires and leaves the other space. Unlike this, the block elements add a line break, so that the next content comes to the new line. We are going to see the div tag soon, through which, you will get an idea of the block element. Remember that the span is an inline element.
