HTML Formatting Tags
HTML formatting tags are essential HTML elements used to define the style or appearance of text. These tags are part of inline elements, meaning they do not break the flow of the text.
Common HTML Formatting Tags
<b> tag makes the text bold.
<strong> tag makes the text bold and increase it's importance.
<i> tag makes the text italic.
<em> tag makes the text italic and increase it's importance.
<u> tag used to underline text.
<mark> highlights the text with a yellow background.
<small> tag makes text smaller.
<ins> tag used to show inserted text.
<del> tag shows deleted text.
<sup>tag displays text as superscript.
<sub> tag displays text as subscript.
The <b> - Element (Bold Text)
<b> makes the text bold. Use this tag to visually emphasize content without implying additional importance.
Example:
<p>This is a <b>bold</b> example.</p>
Try It Yourself
The <strong> - Element (Strong Importance)
<strong> tag makes text bold and indicates its importance. It helps screen readers understand its meaning.
Example:
<p>This is <strong>very important</strong> text.</p>
Try It Yourself
The <i> - Element (Italic Text)
<i> tag makes the text italic for stylistic emphasis.
Example:
<p>This is a <i>italic</i> word.</p>
Try It Yourself
The <em> - Element (Emphasized Text)
<em> Adds emphasis semantically and visually (usually italic). This tag is preferred over <i> for accessibility.
Example:
<p>This is <em>very useful</em>, try this!</p>
Try It Yourself
The <u> - Element (Underlines the text)
The <u> tag used to underline text.
<p><u>This is an example of underlined text.</u></p>
Try It Yourself
The <mark> - Element (Highlighted Text)
The <mark> tag highlights the text with a yellow background (default). Useful for drawing attention.
Example:
<p>This is <mark>important</mark> information.</p>
Try It Yourself
The <small> - Element (Smaller Text)
<small> Displays text in a smaller font size, usually for disclaimers or annotations.
Example:
<p>This is an example of <small>small</small> text.</p>
Try It Yourself
The <del> - Element (Deleted Text)
<del> Strikes through the text, indicating removal or corrections.
Example:
<p>This is <del>incorrect</del> text.</p>
Try It Yourself
The <ins> - Element (Inserted Text)
<ins> Underlines text to show additions, commonly used with <del> for edits.
Example:
<p>This is an <ins>inserted</ins> example.</p>
Try It Yourself
The <sup> - Element (Subscripted Text)
The <sup> tag in HTML is used to display text as superscript. Superscript text appears slightly above the normal text line and is smaller in size. It’s often used for mathematical notations, exponents, or abbreviations like ordinal numbers.
Example:
<p>"E = mc<sup>2</sup>" is a mathematical notation.</p> <p>"1<sup>st</sup>, 2<sup>nd</sup>, 3<sup>rd</sup>" is an example of ordinal numbers.</p>
Try It Yourself
The <sub> - Element (Subscripted Text)
The <sub> tag in HTML is used to display text as subscript. Subscript text appears slightly below the normal text line and is smaller in size. It’s commonly used in chemical formulas, mathematical expressions, and other scientific notations.
Example:
<p>"H<sub>2</sub>O" is the chemical formula for water.</p> <p>"a<sub>n</sub> + b<sub>n</sub> = c<sub>n</sub>" is a mathematical expression.</p>
