Importance of HTML Text Formatting

In HTML,Text formatting tags are used to structure and style the content on a web page. These tags help define the presentation of text, images, and other elements. Some commonly used formatting tags in HTML include:

The Importance of Formatting in HTML

HTML Formatting Elements are tags that allow you to control the presentation and appearance of text or content on a webpage. These elements are used to apply various styles, such as bold, italic, underline, etc.

= Paragraph
<h1>to<h6>= Heading
= Line Break
<hr>= Horizontal Rue
= Bold
= Strong
= Italic
= Emphasisi
= Underline
= Superscript
= Subscript
<code>= Code
<pre>= Preformetted Text
= Mark Text
= Small Text

HTML Paragraph Element

The HTML  element defines a paragraph.

Example

    
<p>This is a paragraph of text.</p>

You can click on above box to edit the code and run again.

Output

This is a paragraph of text.

HTML Heading Element

HTML headings are defined with the <h1>to<h6> tags..

Example

<h1>Main Heading</h1>
<h2>Subheading</h2>

You can click on above box to edit the code and run again.

Output

Main Heading

Subheading

HTML br Element

The tag inserts a single line break.

Example

    
This is some text.<br> Here is a new line.

You can click on above box to edit the code and run again.

Output

This is some text.
Here is a new line.

HTML hr Element

The <hr> tag defines a thematic break in an HTML page (e.g. a shift of topic)..

Example

    
<p>This is some content.</p>
<hr>
<p>This is more content separated by a horizontal line.<p>

This is some text. Here is a new line. You can click on above box to edit the code and run again.

Output

This is some content.

This is more content separated by a horizontal line.

HTML Bold and Srongs Element

The HTML element defines bold text, without any extra importance

The HTML element defines text with strong importance. The content inside is typically displayed in bold.

Example

    
<b>This text is bold.</b>
<p><strong>This text is also strong, typically displayed as bold.</strong></p>

You can click on above box to edit the code and run again.

Output

This text is bold.

This text is also strong, typically displayed as bold.

HTML Italic and Emphasis Element

    Anything that appears within <i>...</i> element is displayed in italicized as shown below
    The HTML <em> element defines emphasized text. The content inside is typically displayed in italic.

Example

    
<i>This text is italicized.</i>
<p><em>This text is emphasized, often displayed as italic.</em></p>

This is some text. Here is a new line. You can click on above box to edit the code and run again.

Output

This text is italicized.

This text is emphasized, often displayed as italic.

HTML Underline Element

Anything that appears within ... element, is displayed with underline as shown below

Example

    
<u>This text is underlined.</u>

This is some text. Here is a new line. You can click on above box to edit the code and run again.

Output

This text is underlined.

HTML Superscript and Subscript Element

The content of a ... element is written in superscript; the font size used is the same size as the characters surrounding it but is displayed half a character's height above the other characters.

The content of a ... element is written in subscript; the font size used is the same as the characters surrounding it, but is displayed half a character's height beneath the other characters.

Example

    
x<sup>2</sup>  (x Square)
H<sub>2</sub>o  (Water)

This is some text. Here is a new line. You can click on above box to edit the code and run again.

Output

x²
H₂o

HTML Code Element

The <code> tag is used to define a piece of computer code. The content inside is displayed in the browser's default monospace font.

Example

    
The is <code>inline code</code> in a sentence.

This is some text. Here is a new line. You can click on above box to edit the code and run again.

Output

The is inline code in a sentence.

HTML Preformatted Element

The <pre> tag in HTML stands for "preformatted text." It is used to define text that should be displayed in a fixed-width (monospaced) font, and it preserves both spaces and line breaks in the text. The <pre> tag is often used when you want to display code snippets, ASCII art, or any other content where maintaining the exact spacing and line breaks is crucial.

Example

<pre>
This is preformatted text.
         
It retains spaces and,
line breaks.
</pre>

This is some text. Here is a new line. You can click on above box to edit the code and run again.

Output

This is preformatted text.
         
It retains spaces and,
line breaks.

HTML Marked Element

The tag defines text that should be marked or highlighted.

Example

    
This is <mark>highlighte</mark> text

This is some text. Here is a new line. You can click on above box to edit the code and run again.

Output

This is highlighte text

HTML Small Element

The content of the ... element is displayed one font size smaller than the rest of the text surrounding it as shown below:

Example

    
<p><small>smaller text</small>  a paragraph.</p>

This is some text. Here is a new line. You can click on above box to edit the code and run again.

Output

smaller text a paragraph.