HTML Formatting Tags
HTML Formatting is a process of formatting text for better look and feel. HTML provides us ability to format text without using CSS. There are many formatting tags in HTML. These tags are used to make text bold, italicized, or underlined. There are almost 14 options available that how text appears in HTML and XHTML.
In HTML the formatting tags are divided into two categories:
- Physical tag: These tags are used to provide visual appearance to the text.
- Logical tag: These tags are used to add some logical or semantic value to the text.
There are some physical and logical tags which may give same visual appearance but they will be different in semantics.
List of HTML Formatting Tags
| Element name | Description |
|---|---|
| <b> | This is physical tag, which is used to bold the text written between it. |
| <strong> | This is a logical tag, which is tells the browser that the text is important. |
| <i> | This is physical tag which is used to make text italic. |
| <em> | This is a logical tag which is used to display content in italic. |
| <mark> | This tag is used to highlight a text. |
| <u> | This tag is used to underline text written between it. |
| <tt> | This tag is used to appear a text in teletype. (not supported in HTML5) |
| <strike> | This tag is used to draw a strikethrough on a section of text. (Not supported in HTML5) |
| <sup> | It display the content slightly above the normal line. |
| <sub> | It display the content slightly below the normal line. |
| <del> | This tag is used to display the deleted content. |
| <ins> | This tag display the content which is added |
| <big> | This tag is used to increase the font size by one conventional unit. |
| <small> | This tag is used to decrease the font size by one unit from base font size. |
Example
<!doctype html>
<html>
<head>
</head>
<body>
<p>
<b>Write Your First Paragraph in bold text.</b><br><br>
<strong>This is an important content</strong><br><br>
<em>This is an important content</em><br><br>
<h2> I want to put a <mark> Mark</mark> on your face</h2><br><br><br>
<u>Write Your First Paragraph in underlined text.</u><br><br>
<strike>Write Your First Paragraph with strikethrough</strike><br><br>
Hello <tt>Write Your First Paragraph in monospaced font.</tt><br><br>
Hello <sup>Write Your First Paragraph in superscript.<br><br>
Hello <sub>Write Your First Paragraph in subscript.</sub><br><br>
Hello <del>Delete your first paragraph.</del><br><br>
<del>Delete your first paragraph.</del><ins>Write another paragraph.</ins><br><br>
Hello <big>Write the paragraph in larger font.</big><br>
</p>
</body>
</html>
Write Your First Paragraph in bold text.
This is an important content
This is an important content
I want to put a Mark on your face
Write Your First Paragraph in underlined text.
Hello Write Your First Paragraph in monospaced font.
Hello Write Your First Paragraph in superscript.
Hello Write Your First Paragraph in subscript.
Hello
Hello Write the paragraph in larger font.
📍If you write anything within <b>............</b> element, is shown in bold letters.
📍If you write anything between <strong> ??????. </strong>, is shown important text.
📍If you write anything within <i>............</i> element, is shown in italic letters.
📍The HTML <em> tag is a logical element, which will display the enclosed content in italic font, with added semantics importance.
