HTML Formatting Tags in Hindi
HTML पेज को अधिक आकर्शित बनाने के लिए एचटीएमएल में कुछ html formatting tags को define किया गया है | CSS से हम एचटीएमएल पेज को अच्छा बना सकते हैं | पर html के कुछ ऐसे tags भी हैं जो webpage के लुक को अच्छा बनती है | तो चलिए सारे formatting tags को सिखतें हैं |
Formatting Tags List
- bold tag – notation <b>
- strong tag – notation <strong>
- italic tag – notation <i>
- emphasize tag – notation <emp>
- underline tag – notation <u>
- mark tag – notation <mark>
- superscript tag – notation <sup>
- subscript tag – notation <sub>
- small tag – notation <small>
- big tag – notation <big>
- quotation tag – notation <q>
- strike tag – notation <s>
- abbreviation tag – notation <abbr>
- monospaced font – notation <tt>
- insert tag – notation <ins>
- delete tag – notation <del>
Bold tag
जैसे की नाम से पता चल रहा है, की इस tag से हम text को bold कर सकते हैं | आपने word file में देखा होगा कैसे कुछ text bold letter में लिखे होतें हैं | वही काम bold tag, html पेज में करता है | और इस tag <b> लिखा जाता है |
Syntax:
<b>sample-text</b>
उदाहरण:
<p>This is the sample which should be <b>look</b> good</p>
परिणाम:
strong tag
strong tab का उपयोग किसी text को bold करने के उपयोग होता है |
Syntax:
<strong>sample-text</strong>
उदाहरण:
<p>This is strong<strong>sample text</strong> example</p>
output:
bold tag vs strong tag
bold tag और strong tag में क्या अंतर है?
ये दोनों tags का उपयोग text को bold करने के लिए होता है | पर दोनों में अंतर ये है की जब किसी text को bold करने के साथ साथ उसे अधिक महत्व देना हो तो <strong> tag को लिया जाता है |
पर text को सिर्फ bold करना है बिना महत्व दिए तब <bold> tag लिया जाता है |
Italic tag
italic tag से हम किसी text को italic कर सकते हैं | और इस tag <i> सिंबल से लिखा जाता है |
Syntax:
<i>sample-text</i>
उदाहरण:
<p>This is italic <i>sample text</i> example</p>
परिणाम:
Emphasize Tag
Emphasize tag से हम किसी text को italic कर सकते हैं | और इस tag <em> सिंबल से लिखा जाता है |
Syntax:
<em>sample-text</em>
उदाहरण:
<p>This is Emphasize<em>sample text</em> example</p>
output:
italic tag vs emphasize tag
italic tag और emphasize tag में क्या अंतर है?
ये दोनों tags का उपयोग text को italic करने के लिए होता है | पर दोनों में अंतर ये है की जब किसी text को italic करने के साथ साथ उसे अधिक महत्व देना हो तो <em> tag को लिया जाता है |
पर text को सिर्फ italic करना है बिना महत्व दिए तब <i> tag लिया जाता है |
Underlined tag
underlined tag से किसी text को underlined किया जा सकता है | और इस tag <u> सिंबल से लिखा जाता है |
Syntax:
<u>sample-text</u>
उदाहरण:
<p>This is one <u>underline sample text</u> example</p>
परिणाम:
HTML Mark Tag
Mark Tag का उपयोग document में किसी text को marked या highlight करने के लिए किया जाता है |
Syntax:
<mark> sample text</mark>
उदाहरण:
<html> <head> <title>Formatting Tag Example</title> </head> <body> <p>Content having <mark>rule and regulations</mark> should be read carefully</p> </body> </html>
output:
Superscript Tag
text में कुछ हिस्से को जब थोडा ऊपर दिखाना हो, तो इस tag का इस्तेमाल किया जाता है | जैसे math में square root होता है उसे html document में लिखने के लिए superscript tag को लिया जाता है |
Syntax:
<sup>sample-text</sup>
उदाहरण:
<p>x square symbol is : X<sup>2</sup></p>
परिणाम:
Subscript Tag
कुछ text को दुसरे text के थोडा निचे लिखने के लिए subscript tag का इस्तेमाल किआ जाता है |
Syntax:
<sub>sample-text</sub>
उदाहरण:
<p>Carbon Dioxide Chemical symbol is: C<sub>2</sub>O</p>
<p>Water Chemical symbol is: H<sub>2</sub>O</p>
परिणाम :
Small tag
<small> tag से text को एक साइज़ छोटा करके दिखाया जा सकता है | comment लिखने या copyright text लिखने के लिए small tag का इस्तेमाल किया जाता है |
Syntax:
<small>sample-text</small>
उदाहरण:
<p>Sample text for showing <small>small font</small> look</p>
परिणाम :
उदाहरण में देखिये “small font” अन्य text से थोडा छोटा दिखा रहा है |
Big tag
<big> tag से text को एक साइज़ बड़ा करके html document दिखाया जा सकता है |
Syntax:
<big>sample-text</big>
उदाहरण:
<p>Sample text for showing <big>big font</big> look</p>
परिणाम :
Quotation Tag
Quotation tag के जरिये किसी content में quotation लगाने के लिए इस्तेमाल होता है | quotation tag को <q> सिंबल से लिखी जाती है |
Syntax:
<q>sample-text</q>
उदाहरण:
<p>quotation tag <q>Sample code
</q> in Html</p>
आउटपुट
strike html tag
किसी text के बिच रेखा कटी हुयी दिखाना है तो strike tag का इस्तेमाल होता है | strike tag को <strike> या फिर <s> से लिख सकतें हैं |
Syntax:
<s>sample-text</s>
उदाहरण:
<p>strike tag <s>Sample code
</s> in Html</p>
आउटपुट
abbreviation tag
किसी short text की fullform बताने के लिए abrreviation tag का इस्तेमाल होता है | जब हम किसी text या tag के ऊपर mouse hover करते हैं तो उस text या tag की text दिखाई देती है जिसे tooltip कहा जाता है | तो किसी short text की fullform tooltip से बताई जा सकती है |
उसी tooltip को abbreviation tag के जरिये लिखी जा सकती है | इसे <abbr> सिंबल से लिखी जाती है |
Syntax:
<abbr title=”full text”>sample-text</abbr>
उदाहरण:
<html>
<head>
<title>HTML Formatting Tag</title>
</head>
<body>
<p>to transfer data you can use <abbr title="Pen Drive">PD<abbr></p>
</body>
</html>
output
आउटपुट में देखिये PD text की fullform , mouse hover पे tooltip के जरिये दिखाई दे रही है | ऐसे ही <abbr> tag का इस्तेमाल कर सकतें हैं |
Monospaced Font
Monospaced Font यानि किसी शब्द या लाइन में जितने भी अक्षर (letter) होंगे सबकी चौडाई एक समान होगी | साधारणतः हर letter की अपनी width होती है जैसे “i” की width “m” width से कम है |
पर Monospaced Font में सारे letters को एक जैसी width दी जा सकती है और इस font के लिए <tt> tag का उपयोग होता है |
Syntax:
<tt>sample-text</tt>
उदाहरण:
<html> <head> <title>Formatting Tag Example</title> </head> <body> <p>Checked the <tt>monotonous text</tt> in this line.</p> </body> </html>
output:
<ins> tag
किसी HTML Document कोई नई line या नया शब्द लिखा गया है किसी पुराने शब्द के जगह उसे बताने के लिए उसे <ins> tag के अंदर लिखी जाती है |
Syntax:
<ins> sample text </ins>
<del> tag
किसी HTML Document कोई line या शब्द को हटाया गया उसे बताने के लिए उस शब्द या line को<del> tag के अंदर लिखी जाती है |
Syntax:
<del> sample text </del>
उदाहरण:
<html> <head> <title>Formatting Tag Example</title> </head> <body> <p>i like to eat <del>noodles</del> <ins>biryani</ins></p> </body> </html>
output:
उदाहरण में देखिये noodles शब्द को हटाकर biryani शब्द को पसंद की गयी है इसीलिए output में <del> tag के अंदर noodles को लिखी गयी | जिससे noodles के ऊपर एक cut line आई है | उसी तरह biryani शब्द को <ins> tag में लिखी गयी है, इसीलिए biryani शब्द के निचे underline आई है |