Tutorial for Formatting 

We have so many elements to format our text in HTML like bold, Italic and underline etc now we learn about these options in this tutorial to how text can appear in HTML.

Bold Text

Anything that appears inside <b>...</b> element, will displayed in bold as shown below−

Example

<!DOCTYPE html>
<html>
<head>
   <title>This is Bold Text Example</title>
</head>
<body>
   <p>The following word uses a <b>bold</b>.</p>
</body>
</html>

This will result as below

How to Bold in HTML

Italic Text

Anything that writing inside <i>...</i> element is displayed in italicized.

Example

<!DOCTYPE html>
<html>
<head>
   <title>Italic Text Example</title>
</head>
<body>
   <p>The following word uses an <i>italicized</i> typeface.</p>
</body> 
</html>

This will result as below

how to italic in HTML

Underlined Text

Anything that we write inside <u>...</u> element, is displayed with underline.

Example

<!DOCTYPE html>
<html>
<head>
   <title>Underlined Text Example</title>
</head>
<body>
   <p>The following word uses an <u>underlined</u> typeface.</p>
</body> 
</html>

This will result as below

How to underline in HTML

Strike Text

Anything that written inside <strike>...</strike> element is displayed with strikethrough, which is a thin line through the text

Example

<!DOCTYPE html>
<html>
<head>
   <title>This is Strike Text Example</title>
</head>
<body>
   <p>The following word uses a <strike>strikethrough</strike>.</p>
</body>
</html>

This will result as below

How to use strike in html

Superscript Text

The content written inside a <sup>...</sup> element is written in superscript the font size used is the small size as other characters but this will displayed character's height upside of characters with small size as we use in Microsoft Word or other software.

Example

<!DOCTYPE html>
<html>
<head>
   <title>Superscript Text Example</title>
</head>
<body>
   <p>The following word uses a <sup>superscript</sup> typeface.</p>
</body>
</html>

This will result as below

How to use superscript in HTML

Subscript Text

The content of a <sub>...</sub> element is written in subscript the font size used is the small size as other characters but this will displayed character's height downside of characters with small size as we use in Microsoft Word or other software.

Example

<!DOCTYPE html>
<html>
<head>
   <title>Subscript Text Example</title>
</head>
<body>
   <p>The following word uses a <sub>subscript</sub> typeface.</p>
</body> 
</html>

This will result as below

How to use subscript in HTML

Larger Text

Anything that writing inside <big>...</big> element is displayed one font size larger or big than the rest of the other text.

Example

<!DOCTYPE html>
<html>
<head>
   <title>Larger Text Example</title>
</head>
<body>
   <p>The following word uses a <big>big</big> typeface.</p>
</body>
</html>

This will result as below

How to use Large tag in HTML

Smaller Text

Anything that writing inside <small>...</small> element is displayed one font size smaller or small than the rest of the other text.

Example

<!DOCTYPE html>
<html>
<head>
   <title>Larger Text Example</title>
</head>
<body>
   <p>The following word uses a <small>small</small> typeface.</p>
</body>
</html>

This will result as below

How to use Small tag in HTML