HTML <nav> टैग

HTML <nav> टैग क्या है?

HTML में <nav> एलिमेंट एक सिमेंटिक टैग है जिसका उपयोग HTML दस्तावेज़ में नेविगेशन लिंक का एक खंड परिभाषित करने के लिए किया जाता है। यह प्रमुख नेविगेशन ब्लॉक (मेनू, सामग्री तालिका, पेजिनेशन, ब्रेडक्रंब) के लिए अभिप्रेत है।

यह टैग HTML5 में पेश किया गया था।

उदाहरण

<!DOCTYPE html>
<html>
<body>
<nav>
  <a href="/tutorialslibrary/">Tutorials</a> |
  <a href="/programming_examples/">Codes</a> |
  <a href="/online_dev_tools/">Tools</a> |
  <a href="/articles/">Articles</a> |
  <a href="/questions/index.php/">QA</a> |
  <a href="/current_affairs/index.htm/">Current Affairs</a>
</nav>
</body>
</html>

आउटपुट

नेविगेशन लिंक एक पंक्ति में प्रदर्शित होंगे:

HTML <nav> टैग

कोड विश्लेषण

ऊपर, हमने <a> टैग और href एट्रिब्यूट के साथ कुछ हाइपरलिंक सेट किए हैं:

<a href="/tutorialslibrary/">Tutorials</a> | <a href="/programming_examples/">Codes</a> | <a href="/online_dev_tools/">Tools</a> | <a href="/articles/">Articles</a> | <a href="/questions/index.php/">QA</a> | <a href="/current_affairs/index.htm/">Current Affairs</a>

उन्हें ठीक से व्यवस्थित करने के लिए, हमने <nav> एलिमेंट का उपयोग किया:

<nav>
  <a href="/tutorialslibrary/">Tutorials</a> |
  <a href="/programming_examples/">Codes</a> |
  <a href="/online_dev_tools/">Tools</a> |
  <a href="/articles/">Articles</a> |
  <a href="/questions/index.php/">QA</a> |
  <a href="/current_affairs/index.htm/">Current Affairs</a>
</nav>

सर्वोत्तम अभ्यास

<nav> का उपयोग प्रमुख नेविगेशन ब्लॉक के लिए करें, हर लिंक समूह के लिए नहीं (फुटर लिंक आमतौर पर <nav> में नहीं होते)।
नेस्टेड <nav> एलिमेंट्स अनुमत हैं (उप-मेनू के लिए)।
एक्सेसिबिलिटी: स्क्रीन रीडर <nav> को नेविगेशन लैंडमार्क के रूप में घोषित करते हैं।
CSS के साथ स्टाइल करें (फ्लेक्सबॉक्स/ग्रिड लेआउट के लिए आदर्श)।

ब्राउज़र समर्थन

सभी आधुनिक ब्राउज़र (IE9+) <nav> का समर्थन करते हैं।