HTML Text Formatting


In this tutorial, we will learn about HTML Text Formatting and the many methods for formatting text.

HTML allows us to format text in the same way that we do in MS Word or any other text editing software. We'll go over a couple of these methods.

In this example, we simply show text in HTML strong, tiny, and highlight formats.

Example

Preview

Making text bold or strong

The <b> tag may be used to make text bold or strong. Both opening and closing tags are used in the tag. The text that has to be bolded must be enclosed by the <b> and </b> tags. We may also use the <strong> element to emphasis the text's semantic relevance. It similarly starts with a <strong> tag and concludes with a </strong> tag.

Example

Preview

Italicising or emphasising text

To italicise the text, use the ā€œiā€ element. It begins with the <i> tag and ends with the </i> tag. The <em> element is used to accentuate the text while also adding semantic significance. It begins with the <em> tag and concludes with the </em> tag.

Example

Preview

Highlighting text

The <mark> element may also be used to highlight text in HTML. It has a <mark> beginning tag and a </mark> ending tag.

Example

Preview

Making a text subscript or superscript

The and elements are used to superscript and subscript text, respectively. They both have a tag at the beginning and end.

Example

Preview

Making text smaller

The <small> element is used to reduce the size of the text. The text that has to be rendered smaller should be enclosed by the <small> and </small> tags.

Example

Preview

Striking through the text

The <del> element is used to erase a section of text by striking through it. It also has an opening and closing tag.

Example

Preview

Adding a text

You can use the <ins> element to insert a section of text. It has an opening tag <ins> and a closing tag </ins>. The browser will underline the inserted section.

Example

Preview

FAQs

In HTML, the <strong> tag is used to indicate that the text is of strong importance, while the <b> tag is used to stylistically apply bold formatting to text. The difference between the two tags is semantic: <strong> indicates content that is strongly emphasized, while <b> simply indicates text that should be visually bold. Screen readers and other assistive technologies will typically announce the presence of <strong> text with increased volume or emphasis, while <b> text will be read normally. It is generally recommended to use <strong> for text of strong importance, even if visual boldness is not necessary.

In HTML, the <i> tag is used to apply italics to text, while the <em> tag is used to indicate emphasis on a word or phrase. While both tags can visually italicize text, the <em> tag is more semantically correct as it indicates emphasis to assistive technologies such as screen readers. It is also important to note that the use of the <i> tag is generally discouraged in modern web development and should be replaced with the <em> tag.

The <sub> and <sup> tags in HTML are used to display subscript and superscript text, respectively. The <sub> tag is used to display text below the baseline of the rest of the text, while the <sup> tag is used to display text above the baseline. These tags are commonly used for mathematical expressions, chemical formulas, and footnotes. For example, H2O represents the chemical formula for water, while E=mc2 is the famous equation by Albert Einstein.