Open In App

What are the various formatting tags available in HTML ?

Last Updated : 15 May, 2023
Improve
Improve
Like Article
Like
Save
Share
Report

As we know, HTML provides many predefined elements that are used to change the formatting of text. The formatting can be used to set the text styles (like – bold, italic, or emphasized, etc.), highlight the text, make text superscript and subscript, etc.

In this article, we will discuss different formatting tags in HTML.

<b> and <strong> Tags: Both tags are used to make the text bold. The text content of the tag is shown as important information on the webpage.

Syntax:

<b> ... </b>
<strong> ... </strong>

Example: In this example, we will use <b>and <strong>.

HTML




<!DOCTYPE html>
<html>
<head>
    <title>Bold and strong</title>
</head>
<body>
    <!--Normal text-->
    <p>Normal Text</p>
    <!--Text in Bold-->
    <p><b>Bold Text</b></p>
    <!--Text in Strong-->
    <p><strong> Strong Text</strong></p>
</body>
</html>


Output:

<i> and <em> Tags: Both tags are used to make the text italic and emphasized. Both the element have opening and closing tags.

Syntax:

<i> ... </i>
<em> ... </em>

Example: In this example, we will use <i> and <em>.

HTML




<!DOCTYPE html>
<html>
<head>
    <title>Italic and emphasized</title>
</head>
<body>
    <!--Normal text-->
    <p>Normal Text</p>
    <!--Text in Italics-->
    <p><i>The Text inside italic Tag</i></p>
    <!--Text in Emphasize-->
    <p><em>Emphasized Text</em></p>
</body>
</html>


Output:

<small> and <big> Tags: The <small> tag is used to set small font-size where as <big> tag is used to set big font-size.

Syntax:

<small> ... </small>
<big> ... </big>

Example: In this example, we will use <small> and <big>

HTML




<!DOCTYPE html>
<html>
<head>
    <title>Small and Big</title>
</head>
<body>
    <!--Text in Normal-->
    <p>Normal text</p>
 
    <small>The text inside small Tag</small>
    <p>
        <big>The text inside big Tag</big>
    </p>
</body>
</html>


Output:

<sup> and <sub> Tags: The <sup> tag is used to superscript a text whereas <sub> tag is used to subscript a text.

Syntax:

<sup> ... </sup>
<sub> ... </sub>

Example: In this example, we will use <sup> and <sub> tags

HTML




<!DOCTYPE html>
<html>
<head>
    <title>Superscript and Subscript</title>
</head>
 
<body>
    <!--Text in Normal-->
    <p>Normal Text
    <!--Text in Superscript-->
    <p>
        <sup>superscript </sup> Text
    </p>
    <!--Text in Subscript-->
    <p>
        <sub>subscript</sub>Text
    </p>
</body>
</html>


Output:

 <ins> and <del> Tag: The <ins> tag is used to underline a text marking the part as inserted or added. It also has an opening and a closing tag. This tag is mainly used in text in place of deleted text whereas the <del> tag is used to delete the text it adds a strike line to the text.

Syntax: In this example, we will use <mark> tag

<ins> ... </ins>
<del> ... </del>

Example: In this example, we will use <ins> and <del>

HTML




<!DOCTYPE html>
<html>
<head>
    <title>Inserting and deleting</title>
</head>
<body>
    <!--Deleting andText in Insert-->
    <b>
        <p>The TajMahal is located in
            <del>Bombay</del>
            <ins>Agra</ins>
        </p>
    </b>
</body>
</html>


Output:

HTML <mark> Tag: The <mark> tag is used to highlight a text. It has an opening and closing tag.

Syntax:

<mark> ... </mark>

Example: In this example, we will use <mark> tag

HTML




<!DOCTYPE html>
<html>
<head>
    <title>Highlight</title>
</head>
<body>
    <!--Text in Normal-->
    <p>Normal Text</p>
    <!--Text in Highlight-->
    <p>
        <mark>Highlighted Text</mark>
    </p>
</body>
</html>


Output:



Like Article
Suggest improvement
Previous
Next
Share your thoughts in the comments

Similar Reads