We have to display different types of texts in different styles. That's why there are different tags to format the text differently.
For example: if you want to display underlined text, then you have to put the text inside the <u> and </u> tags. If you want to display deleted text, then you have to use the tags <del> and </del>.
Besides, you have to use CSS to style texts differently. You can fix the size, color, font-weight etc. using CSS.
For example: the <h1> and </h1> tags make the texts larger than all and also make the text bold. But inside the <head> and </head> tag if you keep the CSS h1{size: 12px; color: #333;}, then the heading text's size and color will be changed. In the next tutorials, you will learn CSS.
For example: if you want to display underlined text, then you have to put the text inside the <u> and </u> tags. If you want to display deleted text, then you have to use the tags <del> and </del>.
Besides, you have to use CSS to style texts differently. You can fix the size, color, font-weight etc. using CSS.
For example: the <h1> and </h1> tags make the texts larger than all and also make the text bold. But inside the <head> and </head> tag if you keep the CSS h1{size: 12px; color: #333;}, then the heading text's size and color will be changed. In the next tutorials, you will learn CSS.
Emphasis Text
Emphasis Texts look like Italic Text. We have to use <em> and </em> tags to get Emphasis Text. Jut keep the text between <em> and </em> for the Emphasis Text. Example of Emphasis Text is given below...
This is emphasis Text
Strong Text
Strong Texts look like Bold Text. We have to use the tags <strong> and </strong> to define the texts as Strong. Example of Strong Texts are given below...
This is Strong Text
Small Text
Small Texts are a little bit of smaller texts than the normal size of text. Look at the example given below. However we need to use the tags <small> and </small> to write small texts.
This is Small Text
Inserted Text
Inserted Texts look like Underlined Text. We have to keep the texts between <ins> and </ins> tags to get the Inserted Texts. The example of Inserted Texts are given below.
This is Inserted Text
Deleted Text
The example of Deleted Texts is given below. The Deleted Texts looks like the Strikethrough Texts. We need to use <del> and </del> tags to form Deleted Texts.
Use the Tags <mark> and </mark> to get Marked/Highlighted Texts. The example of Highlighted Text is given below.
This is Marked/Highlighted Text
Computer Code Text
We need to use <code> and </code> tags to get Compute Code Text. Computer Code Text is a special type of text. See the example given below.
This is Computer Code Text
Sample Computer Code Text
We have to type our text between <samp> and </samp> tags to get the Sample Computer Text. This type of text is similar to Computer Code Text. See the example given below.
This is Sample Computer Text
Keyboard Text
To get Keyboard Text you have to keep the text between <kbd> and </kbd> tags. Keyboard Text looks like Computer Code Text. See the example given below.
Example:
This is Keyboard Text
Variable Text
You have to keep your text between <var> and </var> tags to get Variable Texts. The example of Variable Texts is given below.
This is Variable Text
Preformatted Text
To get Preformatted Text you have to keep your text between <pre> and </pre> tags. The example of Preformatted Texts is given below.
This is Preformatted Text
Abbreviation Text
This text defines an Abbreviation or an Acronym. So this is important to decorate a Webpage. Look at the example given below and keep the mouse pointer on RAM. When you will keep your mouse pointer on RAM then Random Access Memory will be appear. We have to use <abbr> and </abbr> tags and the attribute title="Your Text". Look at the codes and result to understand properly.
Codes I have Used
<abbr title="Random Access Memory">RAM</abbr> is very important for a Computer System
Codes I have Used
<abbr title="Random Access Memory">RAM</abbr> is very important for a Computer System
Result for the Above Codes
RAM is very important for a Computer System
Direction Text
Direction Text is a type of text where we may set the text Left to Right or Right to Left. See the example given below to understand Direction Text properly. We have to use <bdo> and </bdo> tags to define Text Direction. But we must have to use dir="value" attribute with the start tag <bdo>. Then the codes will be for Left to Right Text and we have to use <bdo dir="rtl">TEXT DIRECTION</bdo> for Right to Left Text. See the example given below to understand properly.
Codes for Left to Right Text
<bdo dir="ltr">TEXT DIRECTION</bdo>
Result:
TEXT DIRECTION
Codes for Right to Left Text
<bdo dir="rtl">TEXT DIRECTION</bdo>
Result:
TEXT DIRECTION
Quoted Text
We may get Quoted Text using <q> and </q> tags. If we keep any text between <q> and </q> then we will get two Quotation Sign at the beginning and at the end of that text. See the example given below.
Codes for Quoted Text:
<q>This is Quoted Text</q>
Result:
This is Quoted Text
No comments:
Post a Comment