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.
- <p>= Paragraph
- <h1>to<h6>= Heading
- <br>= Line Break
- <hr>= Horizontal Rue
- <b>= Bold
- <strong>= Strong
- <i>= Italic
- <em>= Emphasisi
- <u>= Underline
- <sup>= Superscript
- <sub>= Subscript
- <code>= Code
- <pre>= Preformetted Text
- <mark>= Mark Text
- <small>= Small Text
HTML Paragraph Element
The HTML <p> element defines a paragraph.
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 <br> 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
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.<br> 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 <b> element defines bold text, without any extra importance
The HTML <strong> 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 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.<br> Here is a new line. You can click on above box to edit the code and run again.
Output
This text is emphasized, often displayed as italic.
HTML Underline Element
Anything that appears within <u>...</u> element, is displayed with underline as shown below
Example
<u>This text is underlined.</u>This is some text.<br> Here is a new line. You can click on above box to edit the code and run again.
Output
HTML Superscript and Subscript Element
The content of a <sup>...</sup> 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 <sub>...</sub> 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.<br> Here is a new line. You can click on above box to edit the code and run again.
Output
x2 H2o
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.<br> Here is a new line. You can click on above box to edit the code and run again.
Output
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.<br> 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 <mark> tag defines text that should be marked or highlighted.
Example
This is <mark>highlighte</mark> textThis is some text.<br> Here is a new line. You can click on above box to edit the code and run again.
Output
HTML Small Element
The content of the <small>...</small> element is displayed one font size smaller than the rest of the text surrounding it as shown below: