Pages

Html Basic Tags in hindi

Heading Tags
 
यदि कोई भी document, heading से शुरू होता है, तो आप अपने heading के लिए विभिन्न sizes का use कर सकते हैं। HTML में heading के छह level हैं, जहाँ elements <h1>, <h2>, <h3>, <h4>, <h5> और <h6> का use किया जाता हैं। किसी भी heading को display करते समय, browser उस heading के पहले एक लाइन और heading के बाद एक लाइन को जोड़ता है।

उदाहरण
<!DOCTYPE html>
<html>

   <head>
      <title>Heading Example</title>
   </head>
 
   <body>
      <h1>This is heading 1</h1>
      <h2>This is heading 2</h2>
      <h3>This is heading 3</h3>
      <h4>This is heading 4</h4>
      <h5>This is heading 5</h5>
      <h6>This is heading 6</h6>
   </body>
 
</html>
 
अाउटपुट :


This is heading 1

This is heading 2

This is heading 3

This is heading 4

This is heading 5
This is heading 6 
 
Paragraph Tag:  यह <p> tag आपको text को अलग-अलग paragraphs के लिए structure देने का एक तरीका देता है। जहाँ पर प्रत्येक text के paragraph को opening <p> tag और closing </p> tag के बीच होना चाहिए, जिसको नीचे उदाहरण में दिखाया गया है :
 
उदाहरण
<!DOCTYPE html>
<html>

   <head>
      <title>Paragraph Example</title>
   </head>
 
   <body>
      <p>Here is a first paragraph of text.</p>
      <p>Here is a second paragraph of text.</p>
      <p>Here is a third paragraph of text.</p>
   </body>
</html> 

आउटपुट
 
Here is a first paragraph of text.
Here is a second paragraph of text.
Here is a third paragraph of text.

 
Line Break Tag: जब भी आप <br/> element का उपयोग करते हैं, तो आने वाला कुछ भी अगली लाइन से शुरू होता है। यह टैग empty element का एक उदाहरण है, जहां आपको opening और closing टैग की आवश्यकता नहीं होती है, क्योंकि उनके बीच में डालने के लिए कुछ भी नहीं है।

<br/> tag के पास characters br और forward slash के बीच space होता है। यदि आप इस space को छोड़ते हो तो पुराने browsers को line break करने में परेशानी होगी। और यदि आप forward slash character को miss करते हैं और इनका use करते है, तो यह XHTML में मान्य नहीं होगा।
 
उदाहरण
<!DOCTYPE html>
<html>

   <head>
      <title>Line Break  Example</title>
   </head>
 
   <body>
      <p>Hello<br />
         You delivered your assignment ontime.<br />
         Thanks<br />
         Mahnaz</p>
   </body>
 
</html>

 
आउटपुट
 
Hello.  
You delivered your assignment ontime. 
Thanks  
mahnaz


Centering Content: आप पेज के center में किसी भी content या table cell को put करने के लिए <center> tag का उपयोग कर सकते हैं।
  
उदाहरण
<!DOCTYPE html>
<html>

   <head>
      <title>Centring Content Example</title>
   </head>
 
   <body>
      <p>This text is not in the center.</p>
      
      <center>
         <p>This text is in the center.</p>
      </center>
   </body>
 
</html>

आउटपुट
 
This text is not in the center.
This text is in the center.
 

Horizontal Lines: हॉरिजोन्टल लाइनों को किसी document में visually रूप से sections में तोङने के लिए use किया जाता है। <hr> tag, डाक्यूमेंट में current position से दाँई ओर मार्जिन पर एक लाइन बनाता है, और लाइन के आधार पर उसको ब्रेक करता है।

नीचे दिए गए उदाहरण के अनुसार आप दो पैराग्राफ के बीच एक लाइन दे सकते हो:  

उदाहरण
<!DOCTYPE html>
<html>

   <head>
      <title>Horizontal Line Example</title>
   </head>
 
   <body>
      <p>This is paragraph one and should be on top</p>
      <hr />
      <p>This is paragraph two and should be at bottom</p>
   </body>
 
</html>
 
आउटपुट
 
This is paragraph one and should be on top . 
This is paragraph two and should be at bottom .

यहाँ फिर से <hr /> टैग empty element का एक उदाहरण है, जहां आपको opening और closing tag की जरुरत नहीं है, क्योंकि उनके बीच में जाने के लिए कुछ भी नहीं है।

<hr/> element के पास characters hr और forward slash के बीच space होता है। जिसे छोड़ने पर पुराने browsers को Horizontal line की rendering करने में परेशानी होगी। और यदि आप forward slash character को miss  करते हो और <hr> का उपयोग करते हो, तो यह XHTML में मान्य नहीं होगा।

 
Preserve Formatting: यदि कभी आप चाहें कि आपके text को HTML document में लिखा जाए, तो इसके सटीक format का पालन करें। इस केस में आप preformatted tag <pre> का use कर सकते हैं।
opening <pre> tag और closing </pre> tag के बीच कोई text, source document के formatting को संरक्षित करेगा।
  
उदाहरण
<!DOCTYPE html>
<html>

   <head>
      <title>Preserve Formatting Example</title>
   </head>
 
   <body>
      <pre>
         function testFunction( strText ){
            alert (strText)
         }
      </pre>
   </body>
 
</html>
 
आउटपुट
 
function testFunction( strText ){ 
   alert (strText) 
}
 
 इसे <pre>...</pre> tags के अंदर रखे बिना उसी कोड का उपयोग करने का प्रयास करें।


Nonbreaking Spaces: मान लीजिए आप वाक्यांश "12 Angry Men" का उपयोग करना चाहते हैं। लेकिन यहां आप नहीं चाहते कि कोई browser दो लाइनों में "12, Angry" और "Men" को विभाजित करे।

An example of this technique appears in the movie "12 Angry Men."
 
किसी केस में आप client browser में text को तोड़ना नहीं चाहते हो, तो इसके लिए आपको normal space के बजाय किसी nonbreaking space entity &nbsp का उपयोग करना चाहिए। उदाहरण के लिए, paragraph में "12 Angry Men" को coding करते समय, आपको निम्न code के समान कुछ का उपयोग करना चाहिए:
 
उदाहरण
<!DOCTYPE html>
<html>

   <head>
      <title>Nonbreaking Spaces Example</title>
   </head>
 
   <body>
      <p>An example of this technique appears in the movie "12&nbsp;Angry&nbsp;Men."</p>
   </body>
 
</html>
आउपुट

An example of this technique appears in the movie "12 Angry Men."

भारतीय भाषाओं में सहजता से अनुवाद करने हेतु इस टूल का उपयोग करें  https://transzaar.com/

 

6 comments:

Praveen katiyar said...

"Html Basic Tags" के बारे में जानने के लिए यहाँ से पढे ...

Unknown said...

Gud effort keep it up

Anonymous said...

आपके इस योग्यदान के लिए समाज आपका सदैव ऋणी रहेगा।

technicalveiws.blogspot.com said...

thank u so much

Manish Singh said...

It's great for beginner as they can learn basic HTML syntax here.
Keep it up.
One thing I would like to mention that I need to scroll the whole page, and it seems that the content is very large. Is pagination is possible or you can differentiate it topic wise.

Best wishes with lots of love!!

technicalveiws.blogspot.com said...

Thanks for your precious advise