HTML

HTML Formatting Tags in Hindi – HTML Text Formatting in Hindi

आपने Word Processors जैसे; MS Word, WordPad आदि में Text को Bold, Italic किया होगा? इसे Text Formatting कहा जाता है.

Text Formatting आप HTML में भी कर सकते है. HTML Language में Text Formatting के लिए अलग से Special Elements Define किये गये है. Special Elements को Formatting Elements कहा जाता है.

Formatting Elements Text को Special Meaning में Define करते है. जैसे; <b> Element Bold Text Define करता है, <i> Element Italic Text Define करता है. इनके अलावा भी कई प्रकार के Formatting Tags HTML में Design किये गये है. जिनके बारे में नीचे बताया जा रहा है.

HTML में Formatting Tags के विभिन्न प्रकार

1. Bold Text in HTML

HTML में Bold Text Define करने के लिए Bold Element का इस्तेमाल किया जाता है. इससे Text अपने पास वाले Text की तुलना में गहरा और मोटा हो जाता है. HTML में Bold Text ऐसे लिखा जाता है:

<!DOCTYPE html>
<html>
<head>
<title>Text Formatting Example</title></head>
<body>

 

<p>This is Normal Text.</p>

<p><b>This is Bold Text.</b></p>

</body>

</html>

जब आप ऊपर दिए गए कोड को Browser में देखेंगे तो आपके सामने इस प्रकार का परिणाम आएगा:



This is Normal Text.

This is Bold Text.

2. Strong Text in HTML

Strong Element से किसी Important (महत्वपूर्ण) शब्द/शब्दांश को Define किया जाता है. Strong Element भी शब्दों को अपने पास वाले शब्दों की तुलना में गहरा और मोटा कर देता है. HTML में Strong Element को इस प्रकार Define किया जाता है.

<!DOCTYPE html>
<html>
<head>
<title>Text Formatting Example</title></head>
<body>

 

<p>This is Normal Text.</p>

<p><strong>This is Important Text.</strong></p>

</body>

</html>

जब आप ऊपर दिए गए कोड को Browser में देखेंगे तो आपके सामने इस प्रकार का परिणाम आएगा:



This is Normal Text.

This is Important Text.

Bold vs Strong Element

आप सोच रहे होंगे कि दोनों जब एक ही प्रकार की Formatting करते है, तो दोनों की क्या जरूरत है? और इनमे से किसी एक को कब Define करना चाहिए?

इसका सीधा-सा जवाब है. यदि आपका शब्द अन्य शब्दों की तुलना में महत्वपूर्ण है, तो आप Strong Element को Use कीजिए. अन्यथा आप Bold Element का इस्तेमाल कीजिए.

3. Italic Text in HTML

HTML Document में शब्दों को तिरछा लिखने के लिए Italic Element का इस्तेमाल किया जाता है. Italic Element शब्दों को अन्य शब्दों की तुलना में थोडा तिरछा कर देता है. Italic Element को इस प्रकार Define किया जाता है.

<!DOCTYPE html>
<html>
<head>
<title>Text Formatting Example</title></head>
<body>

 

<p>This is Normal Text.</p>

<p><i>This is Italic Text.</i></p>

</body>

</html>

जब आप ऊपर दिए गए कोड को Browser में देखेंगे तो आपके सामने इस प्रकार का परिणाम आएगा:



This is Normal Text.

This is Italic Text.

4. Emphasized Text in HTML

Emphasized Element से भी शब्दों को तिरछा किया जाता है. लेकिन, एक Emphasized Text का महत्व Italic Text से ज्यादा होता है. Emphasized Element को इस प्रकार Define किया जाता है.

<!DOCTYPE html>
<html>
<head>
<title>Text Formatting Example</title></head>
<body>

 

<p>This is Normal Text.</p>

<p><em>This is Emphasized Text.</em></p>

</body>

</html>

जब आप ऊपर दिए गए कोड को Browser में देखेंगे तो आपके सामने इस प्रकार का परिणाम आएगा:



This is Normal Text.

This is Emphasized Text.

Italic vs Emphasized Element

यहाँ भी आपको वही बात याद रखनी है, जो आपने Bold vs Strong Element में किया है. यदि आपके Text की Importance अन्य Text की तुलना में ज्यादा है, तो आप Emphasized Tag को Use कीजिए. अन्यथा आप Italic Element का इस्तेमाल कीजिए.

5. Strikethrough Text in HTML

Strikethrough Element शब्द/शब्दांश के बीच में एक आडि रेखा खींच देता है. इसे प्रकार Define किया जाता है.

<!DOCTYPE html>
<html>
<head>
<title>Text Formatting Example</title></head>
<body>

 

<p>This is Normal Text.</p>

<p><strike>This is Strikethrough Text.</strike></p>

</body>

</html>

जब आप ऊपर दिए गए कोड को Browser में देखेंगे तो आपके सामने इस प्रकार का परिणाम आएगा:



This is Normal Text.

This is Strikethrough Text.

6. Underline Text in HTML

आपको याद होगा जब आप School/College में Notes लिखते है/थे, तो महत्वपूर्ण शब्दों या पंक्ति के नीचे एक Line खींच देते है. जिससे वह शब्द अलग दिखाई देता था. यहि कार्य HTML Document में Underline Element से किया जाता है. Underline Element Text के नीचे एक आडि रेखा खींच देता है. इसे इस प्रकार Define किया जाता है.

<!DOCTYPE html>
<html>
<head>
<title>Text Formatting Example</title></head>
<body>

 

<p>This is Normal Text.</p>

<p><u>This is Underlined Text.</u></p>

</body>

</html>

जब आप ऊपर दिए गए कोड को Browser में देखेंगे तो आपके सामने इस प्रकार का परिणाम आएगा:



This is Normal Text.

This is Underlined Text.

7. Marked Text in HTML

Marked Text को Mark Element द्वारा Define किया जाता है. इससे खास शब्दों को Highlight किया जाता है. Mark Element को इस प्रकार Define किया जाता है.

<!DOCTYPE html>
<html>
<head>
<title>Text Formatting Example</title></head>
<body>

 

<p>This is Normal Text.</p>

<p>This is <mark>Marked</mark> Text.</p>

</body>

</html>

जब आप ऊपर दिए गए कोड को Browser में देखेंगे तो आपके सामने इस प्रकार का परिणाम आएगा:



This is Normal Text.

This is Marked Text.

8. Deleted Text in HTML

Delete Element से Document से हटाए गए (Removed) शब्द को Define किया जाता है. जिस शब्द पर Delete Element Apply किया जाता है. वह शब्द बीच में से एक आडि रेखा द्वारा कट जाता है.

<!DOCTYPE html>
<html>
<head>
<title>Text Formatting Example</title></head>
<body>

 

<p>This is Normal Text.</p>

<p>This is <del>Deleted</del> Text.</p>

</body>

</html>

जब आप ऊपर दिए गए कोड को Browser में देखेंगे तो आपके सामने इस प्रकार का परिणाम आएगा:



This is Normal Text.

This is Deleted Text.

9. Inserted Text in HTML

Insert Element द्वारा Delete किए गए शब्द की जगह पर अन्य शब्द Define किया जाता है. Insert Element को इस प्रकार Define किया जाता है.

<!DOCTYPE html>
<html>
<head>
<title>Text Formatting Example</title></head>
<body>

 

<p>This is Normal Text.</p>

<p>This is <del>Deleted</del> <ins>Inserted&lt/ins>Text.</p>

</body>

</html>

जब आप ऊपर दिए गए कोड को Browser में देखेंगे तो आपके सामने इस प्रकार का परिणाम आएगा:



This is Normal Text.

This is Deleted Inserted Text.

10. Superscript Text in HTML

Subscript Element द्वारा Superscript Text को Define किया जाता है. यह Text अपने पास वाले Text की तुलना में आधा हो जाता है, और Users को पास वाले शब्द के ऊपर नजर आता है. Subscript Text को इस प्रकार Define किया जाता है.

<!DOCTYPE html>
<html>
<head>
<title>Text Formatting Example</title></head>
<body>

 

<p>This is Normal Text.</p>

<p>This is <sup>Superscript</sup> Text.</p>

</body>

</html>

जब आप ऊपर दिए गए कोड को Browser में देखेंगे तो आपके सामने इस प्रकार का परिणाम आएगा:



This is Normal Text.

This is Superscript Text.

11. Subscript Text in HTML

Subscript Element द्वारा Subscript Text को Define किया जाता है. यह Text Superscript Text से बिल्कुल उल्टा होता है. क्योंकि यह Text अपने पास वाले शब्द से नीचा दिखाई देता है. Subscript Text इस प्रकार Define किया जाता है.

<!DOCTYPE html>
<html>
<head>
<title>Text Formatting Example</title></head>
<body>

 

<p>This is Normal Text.</p>

<p>This is <sub>Subscript</sub> Text.</p>

</body>

</html>

जब आप ऊपर दिए गए कोड को Browser में देखेंगे तो आपके सामने इस प्रकार का परिणाम आएगा:



This is Normal Text.

This is Subscript Text.

12. Bigger Text in HTML

Big Element द्वारा Larger Text को Define किया जाता है. Larger Text अपने पास वाले Text की तुलना में थोडा बडा हो जाता है. Big Text को इस प्रकार Define किया जाता है.

<!DOCTYPE html>
<html>
<head>
<title>Text Formatting Example</title></head>
<body>

 

<p>This is Normal Text.</p>

<p>This is <big>Big</big> Text.</p>

</body>

</html>

जब आप ऊपर दिए गए कोड को Browser में देखेंगे तो आपके सामने इस प्रकार का परिणाम आएगा:



This is Normal Text.

This is Big Text.

13. Small Text in HTML

Small Element द्वारा Small Text को Define किया जाता है. Small Text अपने पास वाले Text की तुलना में थोडा छोटा हो जाता है. Small Text को इस प्रकार Define किया जाता है.

<!DOCTYPE html>
<html>
<head>
<title>Text Formatting Example</title></head>
<body>

 

<p>This is Normal Text.</p>

<p>This is <small>Small</small> Text.</p>

</body>

</html>

जब आप ऊपर दिए गए कोड को Browser में देखेंगे तो आपके सामने इस प्रकार का परिणाम आएगा:



This is Normal Text.

This is Small Text.

आपने क्या सीखा?

इस Lesson में हमने HTML में Text Formatting की जानकारी दी है. आपने जान कि HTML से विभिन्न प्रकार की Text Formatting जैसे; Bold, Italic, Strikethrough, Big, Small, Strong आदि कैसे की जा सकती है? हमे उम्मीद है कि यह Lesson आपके लिए उपयोगी साबित होगा.

#BeDigital

3 Comments

Leave a Comment