×

HTML <span> tag

The span tag in HTML is used as an inline container element to mark up a specific or special chunk of a text or a section of a page.

If you want to edit or add any validation, you may do that using JavaScript with the aid of the class or id property in HTML. If you want to customize the span tag, you can simply do it by using CSS (cascading style sheet).

Syntax:

<body>
<p>……………
<span style="………">
………. 
</span>
……………</p>
</body>

Example

Here is an example in which we used a span element to color a piece of information:

Example 1:

<!DOCTYPE html>
<html>
<head>
<tilte> html span tag </title>
</head>
<body>
<p>My fatherworks in <span style="color: red">red</span>tape company which is famous for shoe making.</p>
</body>
</html>

Output:

HTML Span Tag

Example 2:

<!DOCTYPE html>
<html>
<head>
<title> html span tag </title>
</head>
<body>
<p>Jaideep is my brother who has <span style="color:green">green</span> hairs.</p>
</body>
</html>

Output:

HTML Span Tag

A span element is an HTML element which is used to provide the background color to a part of a text.

Example 3:

<!DOCTYPE html>
<html>
<head>
<title> html span tag </title>
</head>
<body>
<p>Do not read the content highlighted in this paragraph as it has been deleted <span style="background-color: yellow"> “tough conditions makepeople tough”</span>.</p>
</body>
</html>

Output:

HTML Span Tag

Browser support:

List of browsers that support html section tag are mentioned below:

Chrome: Yes

Microsoft Edge: Yes, version 12 needed

Firefox: Yes, version 1 needed

Safari: Yes

Opera: Yes


Related Topics

HTML5 Tags

HTML5 Tags A list of newly included tags is provided in HTML5. These HTML 5 tags (elements) provide a better structure for the document. This list shows description of all HTML...

3 minutes read.

HTML Elements

An HTML element is nothing but a starting tag and then some content and then the closing tag. So we can say HTML elements is everything from the starting tag...

3 minutes read.

HTML <samp> tag

The Samp tag in HTML is used for defining the sample output from the computer program. This tag is a phrase type tag and a container tag that means the...

2 minutes read.

HTML Video

HTML VIDEO: HTML5 has introduced the <video> tag to embed video into the webpage directly without using the plug-ins.   Syntax: <video attributes >     <source src="address" type="video/mp4">     Your browser does not support the video tag.   </video> <video width="320" height="240" controls>     <source src="mountain.mp4" type="video/mp4">     Your browser does not support the video tag.   </video> Output: ← Prev ...

1 minute read.

How to change text color in HTML

Changing the text colour of a web page is essential because it enhances readability. There are several ways to change the colour of the text in HTML, which are as follows: Text...

7 minutes read.

HTML Font Color

The HTML <font> tag has an attribute called color, which defines the color of the text. We use the color attribute inside the <font> tag to specify the color of...

6 minutes read.

Html &lt;center> Tag

The term HTML refers to Hyper Text Markup Language. The most widely used markup language for making web pages is HTML. A structure of web page is described in HTML....

3 minutes read.

Html Wbr Tag

The Line Break Opportunity element A word break opportunity is a place in text from where the browser breaks a line. This opportunity is represented by the element wbr in the...

2 minutes read.

HTML Text Format

Introduction HTML may format text in two different ways. The HTML tags define a text property to make it appear one way or another. A text element may also be formatted...

7 minutes read.

HTML Search Box

The HTML search box is also known as the search bar. It is an input text field that is used to search the content. If the users want to explore...

7 minutes read.

HTML <address> Tag

Hyper Text Markup Language, HTML is the best markup language for creating Web pages. HTML consists of a wide variety of elements. In all of these elements, one element is...

4 minutes read.

Design a tribute page using HTML and CSS

A tribute page is a webpage based on a person who inspired us in our life. In this article, we will create a webpage of Mahatma Gandhi. We are going...

5 minutes read.

Responsive HTML5 and CSS3 Tutorial

Introduction to HTML5 Tutorial HTML5 is the latest and upgraded version of HTML. HTML is a hypertext markup language. Technically, it is not a programming language. It is a markup language. HTML...

17 minutes read.

HTML Nested Table

HTML nested table refers to a table that is created inside another table. The table is in the form of rows and columns. From left to right are called horizontal rows,...

5 minutes read.

HTML Attributes

HTML Attributes provide the additional information about HTML elements. Attributes are always specified in the start tag. Attributes usually comes in pairs. lang Attribute This attribute helps in declaring the language...

2 minutes read.

HTML <strong> tag

The strong element in HTML is used to display the real significant information in bold so that the user or reader will understand it easily. Syntax: <p> <strong>………… </strong> </p> Example Here, we will demonstrate how to...

2 minutes read.

HTML SVG

HTML SVG: SVG stands for Scalable Vector Graphics which defines the graphics for the web. It is a language for describing 2-D graphics in XML. Each drawn shape in SVG is...

1 minute read.

HTML Headings

The titles and subtitles of our webpages are known as HTML headings. Let’s not talk about webpages but giving heading to almost everything like normal paragraphs, articles or let it...

2 minutes read.

HTML Hide Element

The HTML hide element is used to hide the element. We place the hidden attribute inside those elements which we want to hide. The hidden attribute is a Boolean attribute. The...

3 minutes read.

Div Tag in HTML

In HTML, ‘div’ is a tag that specifies division or section in HTML document. But before going in detail of it, let’s first understand about tags in HTML. The tag...

8 minutes read.