HTML एलिमेंट्स
In this page:
<tagname attribute="value">content</tagname>
<tagname attribute="value" />एक Element की संरचना
ज़्यादातर HTML elements को एक opening tag, अंदर के content, और forward slash वाले closing tag की ज़रूरत होती है। closing tag भूल जाना beginners की सबसे आम गलतियों में से एक है और इसके बाद आने वाले पूरे layout को तोड़ सकता है।
उदाहरण: The Structure of an Element
<p>This is the inner content.</p>Nested Elements
HTML आपको elements को दूसरे elements के अंदर रखने देता है। इसे nesting कहा जाता है, और इसी तरह हम complex web layouts बनाते हैं।
सही nesting मायने रखती है: tags को उसी क्रम के उल्टे क्रम में close होना चाहिए जिसमें वे खुले थे, वरना ब्राउज़र आपके markup को अप्रत्याशित तरीके से auto-correct करने की कोशिश करेगा।
उदाहरण: Nested Elements
<div>
<p>Nested inside a div.</p>
</div>Empty Elements
कुछ elements में कोई content या closing tags नहीं होते। इन्हें empty या self-closing elements कहा जाता है, और इनका उपयोग images, line breaks, या metadata जैसी चीज़ें insert करने के लिए किया जाता है।
आम उदाहरणों में img, br, hr, और input शामिल हैं -- इनके लिए closing tag लिखना, element के आधार पर या तो ignore हो जाता है या invalid होता है।
उदाहरण: Empty Elements
<img src="photo.jpg" alt="Photo">
<br>
<hr>
<input type="text">Block बनाम Inline Elements
div और p जैसे block-level elements हमेशा नई line पर शुरू होते हैं और उपलब्ध पूरी width लेते हैं, जबकि span और a जैसे inline elements बिना line break किए आसपास के text के flow के अंदर बैठते हैं।
उदाहरण: Block vs Inline Elements
<div>
<p>Block elements start on a new line.</p>
<span>Inline</span> <a href="#">elements</a> stay in the flow.
</div>Void Elements Reference
img, br, और input के अलावा, HTML void elements की एक निश्चित list define करता है जिसमें hr, meta, link, और source शामिल हैं, जो specification के अनुसार कभी भी content या closing tag नहीं रखते।
उदाहरण: Void Elements Reference
<hr>
<meta charset="UTF-8">
<link rel="stylesheet" href="style.css">
<source src="video.mp4" type="video/mp4">- tags को क्रम से close करने के बजाय उन्हें गलत nesting order में overlap कर देना।
- self-closing empty elements के लिए closing tags लिखने की कोशिश करना।
- अपने layout structure में गलत tag names इस्तेमाल करना या elements की spelling गलत करना।
- एक HTML element opening tag, content, और closing tag को represent करता है।
- elements को एक-दूसरे के अंदर nest करना complex web pages बनाने की कुंजी है।
- Empty elements में सिर्फ attributes होते हैं और उनके closing tags नहीं होते।
सभी standard HTML elements सभी modern platforms पर globally supported हैं।
Chapter Quiz — Complete all 11 topics to unlock
0/11 topics done
Complete these topics first: