Friday 28 March 2014

HTML Elements - एच टी एम एल सीखीये (हिन्दी में)


 एच टी एम एल इलेमेंट

HTML पेज को HTML elements के द्वारा पहचान कर ब्राउजर प्रदर्शित करता है।

HTML Elements

HTML element यानि start tag से end tag के बीच का सब कुछ:
Start tag *
Element content
End tag *
<p>
This is a paragraph
</p>
<a href="default.htm">
This is a link
</a>
<br>


* The start tag को opening tag औरend tag को closing tag भी कहा जाता है।


 HTML Element के नियम
  • HTML element की शुरुआत start tag / opening tag के साथ होती है।
  • HTML element का अंत एक end tag / closing tag के साथ होता है।
  • The element content यानि start और end tag के बीच का सब कुछ।
  • कुछ HTML elements मे empty content भी होते है।
  • Empty elements यानि closed in the start tag यानि ये start tag से ही बंद हो जाते है इनमें end tag नही होता है।
  • ज्यादातर HTML elements के attributes होते है।
नोट : attributes के बारे मे आप आगे पढेंगे.

Nested HTML Elements

ज्यादातर HTML elements nested होते है ( यानि जिनके अंदर अन्य HTML elementsहोते है ).
HTML documents consist of nested HTML elements.

HTML Document Example

<!DOCTYPE html>
<html>
<body>
<p>This is my first paragraph.</p>
</body>
</html>


The example above contains उपरी उदाहरण में 3 HTML elements है।

HTML Example Explained

<p> element:
<p>This is my first paragraph.</p>
<p> element का प्रयोग  HTML पेज में paragraph लिखने के लिये किया जाता है।
element में start tag <p> और end tag </p>.
element मे यह content होता है : This is my first paragraph. (जो ब्राउजर मे प्रदर्शित होता है। )

<body> element:
<body>
<p>This is my first paragraph.</p>
</body>

<body> element का प्रयोग  HTML पेज की body के संदर्भ में किया जाता है।
element में start tag <body> और end tag </body>.
इस element मे एक अन्य HTML element (<p> element) होता है।

<html> element:
<html>
<body>
<p>This is my first paragraph.</p>
</body>
</html>

<html> element का प्रयोग संपूर्ण HTML पेज के संदर्भ में किया जाता है।
element में start tag <html> और end tag </html>.
इस element मे एक अन्य HTML element (body element) होता है।


End tag

यदि आप end tag लगाना भुल गये तो कुछ HTML elements सही से दिखाई नही देगे । जैसे :
<p>This is a paragraph
<p>This is a paragraph

कुछ परेशानियों का उदाहरण –

<!DOCTYPE html>
<html><body><p>    My Bonnie lies over the ocean.

    My Bonnie lies over the sea.

    My Bonnie lies over the ocean.
 
    Oh, bring back my Bonnie to me.
</p>
<p>Note that your browser ignores the layout!</p></body></html>


Empty HTML Elements

वे HTML elements जिनमें कोई अन्य HTML element या कोई content  नही होता है वे empty elements कहलाते है इनमें end tag भी नही लगा होता है।
 <br> एक empty element है जिसमें closing tag भी नही लगा होता है। (<br> tag का प्रयोग  line break (लाइन तोडने) के लिये किया जाता है।
नोट : XHTML में, सभी elements को closed होना चाहिए। empty elements  को भी start tag के अंदर एक slash जोडकर बंद किया जाता है, जैसे -  <br />
इस तरीके से  XHTML (और XML) में empty elements को close किया जाता है।  

नोट : Use Lowercase Tags

HTML tags case sensitive नही होते है: यानि<P> और<p> HTML tags मे एक समान है। पर हमें हमेशा lowercase  (<p>) का प्रयोग ही करना चाहिए क्योकि World Wide Web Consortium (W3C)  भी HTML 4 में lowercase का प्रयोग करने को कहता है और  XHTML मे भी lowercase tags की ही आवश्यकता होती है।

1 comments: