Href एट्रिब्यूट
href एट्रिब्यूट HTML में सबसे महत्वपूर्ण एट्रिब्यूट्स में से एक है।
href URLs निर्दिष्ट करने के लिए उपयोग किया जाता है:
- हाइपरलिंक्स (जिन्हें केवल "लिंक्स" भी कहा जाता है)।
- या बाहरी संसाधनों को आयात करने के लिए, जैसे स्टाइल्स और स्क्रिप्ट्स।
href के लिए सबसे आम उपयोग का मामला एंकर एलिमेंट <a> पर आंतरिक या बाहरी लिंक्स (URLs) जोड़ना है:
<a href="link-path">Click</a>Href के साथ आंतरिक लिंक्स
आइए एक लिंक बनाएं जो आपको क्लिक करने पर फ्रंट पेज पर ले जाए।
इसे हम Home कहेंगे।
सबसे पहले, हम एंकर एलिमेंट को परिभाषित करते हैं:
<a>Home</a>अब <a> एलिमेंट को हाइपरलिंक बनाने के लिए, हम href एट्रिब्यूट जोड़ते हैं:
<a href>Home</a>और इसे "/" का मान असाइन करते हैं:
<a href="/">Home</a>यह ब्राउज़र में कैसे रेंडर होता है:
Home
अच्छे उपाय के लिए, आइए एंकर एलिमेंट उदाहरण को अलग करें:
<a>एक ओपनिंग एंकर टैग है</a>एक क्लोजिंग एंकर टैग हैHomeकंटेंट है (ब्राउज़र में दिखाई देने वाला एकमात्र भाग)hrefएक एट्रिब्यूट नाम है=एक असाइनमेंट ऑपरेटर है"/"एक एट्रिब्यूट मान है
इस वेबसाइट पर, यह सटीक एंकर एलिमेंट हेडर के ऊपरी बाएं कोने में TechStacker लोगो को लपेटता है (यदि आप इस पर क्लिक करते हैं, तो आप फ्रंट पेज पर पहुंच जाते हैं)।
आप अक्सर इस सटीक कोड उदाहरण को वेबसाइट्स के नेविगेशन बार <nav>...</nav> के अंदर उपयोग होते देखेंगे।
मान लें कि आपकी वेबसाइट में कुल 3 पेज हैं, जैसे Home, About, Contact, और आप उनके लिए आंतरिक लिंक बनाना चाहते हैं।
सबसे पहले, प्रत्येक पेज के HTML दस्तावेज़ का नाम इस प्रकार होना चाहिए:
- Home
index.htmlहोना चाहिए - About
about.htmlहोना चाहिए - Contact
contact.htmlहोना चाहिए
और फिर आप प्रत्येक दस्तावेज़ के लिए सापेक्ष पेज रूट (URLs) को इस प्रकार परिभाषित करते हैं:
<a href="/">Home</a> <a href="/about">About</a> <a href="/contact">Contact</a>अब आप प्रत्येक एंकर एलिमेंट को <nav> एलिमेंट के अंदर लपेट सकते हैं:
<nav> <a href="/">Home</a> <a href="/about">About</a> <a href="/contact">Contact</a> </nav>अब आपके पास एक नेविगेशन कंपोनेंट है जिसे आप अपनी वेबसाइट पर हेडर, फूटर, या साइडबार में रख सकते हैं।
Href के साथ बाहरी लिंक्स
यदि आप अपनी वेबसाइट के अलावा किसी अन्य वेबसाइट से लिंक करना चाहते हैं, तो आप एक बाहरी लिंक फॉर्मेट का उपयोग करते हैं, जहां आप एक निरपेक्ष पथ निर्दिष्ट करते हैं:
<a href="https://www.youtube.com">YouTube.com पर लिंक</a>मैं इस अवसर का उपयोग अपने YouTube चैनल से लिंक करने के लिए करूंगा:
मेरे YouTube चैनल (TechStacker) पर लिंक।
