Note/Suggestion:
HTML formatting is very important. A website Designer should know how to format HTML texts.
For Example:
You must know how to make a text bold, strong, italicize, emphasize, underline, marking of text, inserting a new text/s, deleting an old text by removing it, adding a subscript and superscript, making a text small and so on.
- If you want to show that a particular text has more importance than the normal text, then use strong tag.
- If you want to make your text appear more heavy as compared to the normal text, then use b tag. This does not make the text important rather makes it heavier and shows that this text has higher priority while reading to grab the attention of the user.
- If you want to emphasize on a particular text, then use em tag. This makes the text as an important text and the text appears like an italic text.
- If you want to italicize a particular text, then use i tag. This does not mark the text as an important text rather italicize the text only.
- If you want to show your text look smaller than the normal text, then you can use small tag. Note that , you can achieve similar result using CSS which is a better option. The use of small tag is specific to a particular need. This is not a replacement for subscript or superscript.
- If you want to show a particular text/s as a subscript text/s, then use sub tag. We use this tag mostly in chemical formulas and mathematical formulas
- If you want to show a particular text/s as a superscript text/s, then use sup tag. Mostly we use this tag in chemical formulas and mathematical formulas
- If you want to mark a particular text/s, then use mark tag. You can correlate this with a situation when you are reading a book and you want to mark a text or group of text with a marker.
- If you want to delete a particular text/s by removing it logically by a way of striking it out, then you can use
delete tagdel tag. - If you want to insert new text/s by inserting it logically, then you can use ins tag (insert tag).
- There are some other formatting options like samp tag which is used to show the sample ouotput of a computer program,
code tag
which is used to show the computer code, kbd tag which is used to show the keyboard input text, var tag which is used to show that this particular text is a variable. These tags are less frequently used and are only used in case of special requirements.
HTML Formatting for text
Example for HTML Formatting, list of all HTML Formatting for text.
Tag | Description |
---|---|
<strong> | Strong text - Texts which are important |
<b> | Bold text |
<em> | Emphasized text |
<i> | Italic text |
<small> | Small text |
<sub> | Subscript text |
<sup> | Superscripted text |
<ins> | Inserted text |
<del> | Deleted text |
<mark> | Marked text |
<samp> | sample output of a computer program |
<code> | To show the computer code - Like a programming code |
<kbd> | keyboard input text |
<var> | To display the text as a variable - Like Programming variable |
HTML <b> Tag
The <b> tag specifies a bold text. We do not use bold for marking our text as an important text. For marking your text as an important text, use <strong> tag
HTML <em> Tag
The tag emphasizes the text. It provides more emphasis on a particular text and makes that text an important text.
HTML <i> Tag
The tag specifies text in italic form. We use this tag to make our text stand out different from surrounding texts.
HTML <small> Tag
The <small> tag reduce the size of font.
HTML <strong> Tag
The <strong> tag specifies important text.
HTML <sub> Tag
The <sub> tag defines subscript text.
Example
<h4>Example for <sub>subscripted</sub> text.</h4> <p> The 'sub' tag renders text into a small size and starts the text half below the normal text </p>
HTML <sup> Tag
The <sup> tag defines superscripted text.
Example
<p>Example for <sup>superscripted</sup> text.</p> <p>The 'sup' tag renders text into a small size and starts the text half above the normal text</p>
HTML <ins> Tag
The <ins> tag defines inserted text in HTML document.
Example
<p>The ins tag is used to insert the text and inserted text will be underlined.</p> <p>Welcome <ins>to</ins> Bangalore</p>
HTML <del> Tag
It defines deleted text in HTML document.
This is used when you want to correct text/s but wish to show the previous value which must strike out.
In a way, this is used to correct a value by striking out the old value which is removed and replacing it with a new value.
Example
<p>Using del element we can delete text and del tag strike-through the deleted word to define it is deleted.</p> <p>what is <del>my</del> your name?</p>
HTML <mark> Tag
The HTML <mark> tag describes the marked text.
This was added as part of HTML5.
Example
<h2>This is <mark>Marked</mark> text</h2> <p> Mark tag marks the text in yellow ink and to highlight that it is marked.</p>
HTML <u> Tag
The <u> tag underlines specified text.
Example
<h2>This is <u>underlined text</u> text</h2> <p>It underlines the given text.</p>
HTML <samp> Tag
The <samp> tag is rarely used in HTML. This is used in a case, you want to show the sample output of the computer program.
Example
<h2>This is used to show the <samp>sample output of the computer program</samp> </h2> <p>To show the sample output of the computer program.</p>
HTML <code> Tag
The <code> tag is rarely used in HTML. This is used in a case, you want to show the computer code.
Example
<p>This is used to show <code>the computer code</code></p> <p>In HTML <code>code tag represents text in form of </code> computer code.</p>
HTML <kbd> Tag
Example
<p>This is used to show <code>the input keyboard text</code></p> <p>Hello <kbd>The text given inside kbd tag represents keyboard text.</kbd> Thank you.</p>
HTML <var> Tag
The <var> tag is rarely used in HTML. This is used in a case, you want to define a text as a variable. And when you want to store a value in a variable and use that value in any mathematical calculation or an arithmetic operation. You can use this in case of programming variable as well.
Example
<p>Find the value of y in <var>11y</var> - <var>10</var> = <var>12</var> + <var>13y</var></p>
Interview Questions & Answer
There are many Formatting Tags in HTML like, <b>, <i>, <mark>, etc. It is used for formatting text and HTML elements for better look and appearance.
<b> tag is used to bold the text.
<i> tag is used for italic text.
<mark> tag is used to mark the text.
The <pre> tag describes preformatted text in HTML page. Browsers usually render <pre> text into a fixed-pitched font. It contains line breaks and spaces. And font face is displayed in courier by default. For Example, <pre> The pre tag describes preformatted text in HTML page. It contains line breaks and spaces </pre>
Difference between <b> and <strong> tag:-
- If you want to show that a particular text has more importance than the normal text, then use a <strong> tag.
- If you want to make your text appear heavier as compared to the normal text, then use the <b> tag. This does not make the text important rather makes it heavier and shows that this text has a higher priority while reading to grab the attention of the user.
Difference between <i> and <em> tag:-
- If you want to emphasize on a particular text, then use <em> tag. This makes the text as an important text and the text appears like an italic text.
- If you want to italicize a particular text, then use <i> tag. This does not mark the text as an important text rather italicize the text only.