Top HTML Text Formatting tags for beginners
Formatting is one of the important parts of a website design. Poorly formatted text is hard to read, and users don’t waste their time focusing on words and they open the next link. So, there is a need to display properly formatted text on your website. HTML provides multiple formatting tags, that will help you in making text bold, underlined, and so on.
In this article, you are going to see HTML formatting tags, their usage and you will also see the result of each formatting tag.
Bold Text
To make an text bold, you can wrap that text portion in <b>bold</b> text. The text insides these tags will be rendered as Bold Text.
<b>Bold</b> Text
Output:
Bold Text
Important Text
If you need to have some part of your text stands out, you need to use <strong> tag. Strong tags makes the text bold and are used for important texts on your site.
This sentence is most <strong>important</strong> for us.
Output:
This sentence is most important for us.Italics
HTML formatting tag <i> provides a way for you to make your text in italics. Italics text gives significance to words or sentences.
This is an <i>Italics</i> text.
Output:
This is an Italics text.Underlined
To make your text underlined, you need to use <u> formatting tag.
Some <u>underlined</u> text.
Output:
Some underlined text.Emphasized Text
<em> is used to put emphasis on your text. It draws attention to your site.
This text has some <em>emphasis</em>.
Output:
This text has some emphasis.Highlighted Text
To make your text highlighted, you can use the <mark> formatting tag. It makes your text stands out from the rest of the text.
This is a <mark>marked</mark> text.
Output:
This is a marked text.Bigger Text
Sometimes, you need a bigger text than the rest of your text font size. If you don’t want to use span tag and do some custom font sizing, you can use the <big> tag. It will render your text bigger than the rest of your text.
The extra large pizza was so <big>big</big> that it nearly covered the entire table.
Output:
The extra large pizza was so big that it nearly covered the entire table.Smaller Text
Unlike the <big> tag, the <small> tag makes your text go smaller than the rest of your text.
<small>Smaller</small> blocks are still split with hammers and wedges.
Output:
Smaller blocks are still split with hammers and wedges.Deleted Text
<del> tag represents the text that is now deleted or is replaced by some other text.
This <del>sentence</del> text is no longer in use.
Output:
ThisInserted Text
The Inserted text tag < ins > is used along with <del> tag, to represent the deleted text and the inserted text.
My favorite color is <del>red</del> <ins>blue</ins>!
Output:
My favorite color isSubscript Text
To use a subscript text in your website, you need to use <sub> tag. Subscript text renders half a character below the normal line, and is used for chemical formulas, like for the formula of water.
The chemical formula of water is H<sub>2</sub>O.
Output:
The chemical formula of water is H2O.Superscript text
The superscript text renders above the normal text line, and is used in situations, such as assigning power to x and so on.
Power of x<sup>3</sup>.
Output:
Power of x3.Conclusion:
Properly formatted website is one of the main reason, users will stay on your website. They need clear text, that is easier to see You need to make sure that your most important text is bold. That is where HTML formatting tags come in. They allow you to properly format your website, without the hassle of doing custom CSS.
If you need to make your text bold, you need to use either <b> or <strong> to put a strong emphasis on it.
Which formatting tag do you like the most? Comment down ⬇ below.
