HTML

All Languages C CPP JAVA HTML CSS JAVASCRIPT PYTHON

Formatting Elements In Html

In the previous chapter, you learned about the HTML style attribute.
HTML also defines special elements for defining text with a special meaning.

HTML uses elements like </b> and <i> for formatting output, like bold or italic text.

Formatting elements were designed to display special types of text:

<b> - Bold text

<strong> - Important text

<i> - Italic text

<em> - Emphasized text

<mark> - Marked text

<small> - Small text

<del> - Deleted text

<ins> - Inserted text

<sub> - Subscript text

<sup> - Superscript text

HTML <b> and <strong> Elements

The HTML <b> element defines bold text, without any extra importance.

Example

<!DOCTYPE html>
<html>
<body>

<p>This text is normal.</p>

<p><b>This text is bold.</b></p>

</body>
</html>

output

This text is normal.

This text is bold.

The HTML <strong> element defines strong text, with added semantic "strong" importance.

Example

<!DOCTYPE html>
<html>
<body>

<p>This text is normal.</p>

<p><strong>This text is strong.</strong></p>

output

This text is normal.

This text is strong.

HTML <i> and <em> <small> Elements

The HTML <i> element defines italic text, without any extra importance.
The HTML <em> element defines emphasized text, with added semantic importance.
The HTML <small> element defines smaller text:

Example

<!DOCTYPE html>
<html>
<body>

<p>This text is normal.</p>

<p><i>This text is italic.</i></p>
<p><em>This text is emphasized.</em></p>
<h2>HTML <small>Small</small> Formatting</h2>

</body>
</html>

output

This text is normal.

This text is italic.

This text is emphasized.

HTML Small Formatting

HTML <mark>,<del>,<ins> elements

The HTML <mark> element defines marked or highlighted text:
The HTML <ins> element defines inserted (added) text.

Example

<!DOCTYPE html>
<html>
<body>

<h2>HTML <mark>Marked</mark> Formatting</h2>
<p>The del element represents deleted (removed) text.</p>

<p>My favorite color is <del>blue</del> red.</p>
<p>The ins element represent inserted (added) text.</p>

<p>My favorite <ins>color</ins> is red.</p>
</body>
</html>

output

HTML Marked Formatting

The del element represents deleted (removed) text.

My favorite color is blue red.

The ins element represent inserted (added) text.

My favorite color is red.

HTML <sub>,<sup> Elements

The HTML <sub> element defines subscripted text.
The HTML <sup> element defines superscripted text.

Example

<!DOCTYPE html>
<html>
<body>
<p>This is <sub>subscripted</sub> text.</p>
<p>This is <sup>superscripted</sup> text.</p>

</body>
</html>

output

This is subscripted text.

This is superscripted text.