HTML Formatting tags
HTML formatting tags are used to apply various styles and effects to text and content within a web page. These tags allow you to change the appearance of text, such as making it bold, italic, underlined, or using different font sizes and colors.
Common HTML formatting tags
Here are some common HTML formatting tags along with examples,
Bold Text (<b> or <strong>)
- <b> Render the text in bold.
- <strong> Indicates strong emphasis, often rendered as bold by browsers
Example-
<p>This is <b>bold</b> text.</p>
<p>This is <strong>strong</strong> text.</p>
Italic Text (<i> or <em>)
- <i> Renders text in italic.
- <em> Indicates emphasis, often rendered as italic by browsers.
Example-
<p>This is <i>italic</i> text.</p>
<p>This is <em>emphasized</em> text.</p>
Underlined Text (<u>)
- <u> Renders text with an underline.
Example-
<p>This is <u>underlined</u> text.</p>
Strikethrough Text(<s> or <strike>)
- <s> or <strike> Renders text with a strikethrough line.
Example-
<p>This is <s>strikethrough</s> text.</p>
<p>This is <strike>also</strike> strikethrough text.</p>
Superscript Text (<sup>)
- <sup> Renders text as superscript (raised above the baseline).
Example-
<p>This is 10<sup>th</sup> superscript text.</p>
Subscript Text (<sub>)
- <sub> Renders text as subscript (lowered below the baseline).
Example-
<p>This is H<sub>2</sub>O subscript text.</p>
Font Size (<font>)
- <font size="value"> Sets the size of the text, where "value" can be a numerical value (1-7) or relative values like "small", "medium", "large", etc.
Example-
<p><font size="4">This is large text.</font></p>
Font Color ( <font> )
- <font color="value"> Sets the color of the text, where "value" can be a color name (e.g., "red", "blue", "green") or a hexadecimal color code (#RRGGBB).
Example-
<p><font color="red">This is red text.</font></p>
Note-
some of these tags, such as <b>, <i>, <u>,
<s>, <font>, are considered deprecated in favor of using CSS for styling. It's recommended to use CSS for styling whenever possible for better separation of concerns and maintainability.
Example-
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Formatting tags Example</title>
</head>
<body>
<!-- Example using mostly used formatting tags -->
<div class="formatted">
<p>This is <b>bold</b> text.</p>
<p>This is <i>italic</i> text.</p>
<p>This is <u>underlined</u> text.</p>
<p>This is <s>strikethrough</s> text.</p>
<p>This is <sup>superscript</sup> text.</p>
<p>This is <sub>subscript</sub> text.</p>
<p><font size="5">This is large text.</font></p>
<p><font color="red">This is red color text.</font></p>
</div>
</body>
</html>Output-
This is bold text.
This is italic text.
This is underlined text.
This is strikethrough text.
This is superscript text.
This is subscript text.
This is large text.
This is red color text.
Leave Comment