Hyperlinks () in html hindi

Hyperlinks (<a>) in html hindi

एचटीएमएल वेब पेज में टेक्स्ट, इमेज, ऑडियो, वीडियो, ईमेल, वेब पेज, सेक्शन, फ़ोन नंबर, समान पेज लिंक, रिलेटिव और अब्सोलुट वेब पेज लिंक, आदि और अन्य किसी भी प्रकार के वेब पेज हाइपरलिंक टेक्स्ट इनफार्मेशन क्रिएट करने के लिए आप एचटीएमएल वेब पेज में हाइपरलिंक <a> एंकर टैग का उपयोग करते है। सामान्य भाषा में हाइपरलिंक का मतलब आप किसी मौजूदा एचटीएमएल वेब पेज में किसी लिंक या ऑब्जेक्ट पर क्लिक करने पर सोर्स हाइपरलिंक लोकेशन को डेस्टिनेशन सोर्स हाइपरलिंक लोकेशन पर वेब यूजर को इमीडियेट मूव करता है. 

Hyperlinks () in html hindi

Basic structure of hyperlink <a> tag in HTML web page.

यदि आप एचटीएमएल वेब पेज में हाइपरलिंक टेक्स्ट इनफार्मेशन को क्रिएट करना चाहते है, तो एचटीएमएल वेब पेज <a> एंकर टैग की सहायता से आप हाइपरलिंक टेक्स्ट इन्फो क्रिएट कर सकते है।

HTML web page hyperlink basic syntax.

<a href=”https://vcanhelpsu.com”>click to open url</a>

<!DOCTYPE html>

<html lang=”en”>

<head>

    <meta charset=”UTF-8″>

    <meta name=”viewport” content=”width=device-width, initial-scale=1.0″>

    <title>Simple Hyperlink Tag</title>

</head>

<body>

    <p><b>Vcanhelpsu Website Simple Hyperlink</b></p>

    <p><a href=”https://www.vcanhelpsu.com”>Open Vcanhelpsu Website</a></p>

</body>

</html>

Feature of anchor, hyperlink tag in HTML web page.

  • href – एचटीएमएल वेब पेज में वेब साइट पेज या वेबसाइट एड्रेस लोकेशन को डिफाइन करता है। यहाँ href लिंक वेबसाइट या वेबपेज पेज लोकेशन को लिंक के लिए ऐड करता है, जहा क्रिएट लिंक वेब यूआरएल सोर्स लिंक को लिंक कर ओपन करता है।
  • target – हाइपरलिंक लिंक लोकेशन को इंडीकेट करता है, जहा लिंक किए गए वेबसाइट यूआरएल डॉक्यूमेंट ऑब्जेक्ट को कैसे और कहाँ क्लिक कर ओपन करना  है। ये सारी प्रॉपर्टीज को टारगेट हाइपरलिंक प्रॉपर्टीज में कॉन्फ़िगर करते है.

Common anchor tag properties are.

  • _self (डिफ़ॉल्ट) – मौजूदा वेब पेज में एक्सेस लिंक को उसी वेब पेज फ्रेम या वेब ब्राउज़र टैब में ओपन करता है।
  • _blank – ओपन होने वाले वेब पेज के डिफ़ॉल्ट ब्लेंक पेज नए टैब या ब्लेंक विंडो में लिंक को इमीडियेट ओपन करता है।
  • _parent – क्रिएटेड वेब पेज में डेवेलप हाइपरलिंक टेक्स्ट ऑब्जेक्ट को पैरेंट फ़्रेम विंडो में ओपन करता है।
  • _top – यूजर क्रिएटेड हाइपरलिंक टेक्स्ट या ऑब्जेक्ट को फुलस्क्रीन विंडो में ओपन करता है।

Basic hyperlink link example.

<a href=”https://www.vcanhelpsu.com” target=”_blank”>Open Link in Default New Browser Tab</a>

<!DOCTYPE html>

<html lang=”en”>

<head>

    <meta charset=”UTF-8″>

    <meta name=”viewport” content=”width=device-width, initial-scale=1.0″>

    <title>New Open Window Tag</title>

</head>

<body>

    <p><b>Target New Tab Open Link</b></p>

    <p> <a href=”https://www.vcanhelpsu.com” target=”_blank”>Open Vcanhelpsu Website In New Tab</a></p>

</body>

</html>

title – क्रिएटेड हाइपरलिंक के बारे में वेब यूजर को एक अतिरिक्त टूलटिप वेबपेज लिंक इनफार्मेशन प्रदान करता है, यह एक टूलटिप के रूप में प्रयोग होता है. जब इंटरनेट सर्फर अपने माउस से लिंक पर होवर करता है। तो यह टूल टिप उसे उस लिंक के बारे में टाइटल इन्फो डिस्प्ले करता है.

html web page title tooltip example.

<a href=”https://www.vcanhelpsu.com” title=”open vcanhelpsu”>it move you vcanhelpsu url</a>

<!DOCTYPE html>

<html lang=”en”>

<head>

    <meta charset=”UTF-8″>

    <meta name=”viewport” content=”width=device-width, initial-scale=1.0″>

    <title>Hyperlink Tooltip Tag</title>

</head>

<body>

    <p><b>Title Tooltip Properties</b></p>

    <p><a href=”https://www.vcanhelpsu.com” title=”Open Vcanhelpsu”>Open Vcanhelpsu With title Properties</a></p>

</body>

</html>

rel – रिलेटिव हाइपरलिंक एंकर टैग में करंट डॉक्यूमेंट और लिंक किए गए यूआरएल डॉक्यूमेंट के बीच रिलेशन एस्टब्लिश करता है। जैसे, rel=”noopener noreferrer” टेक्स्ट सिक्योरिटी पर्पस को बेहतर करने के लिए target=”_blank” के साथ हाइपरलिंक को सेफ ओपन किया जाता है।

Relative and blank title properties example in html web page.

<a href=”https://www.vcanhelpsu.com” target=”_blank” rel=”noopener noreferrer”>open vcanhelpsu url</a>

<!DOCTYPE html>

<html lang=”en”>

<head>

    <meta charset=”UTF-8″>

    <meta name=”viewport” content=”width=device-width, initial-scale=1.0″>

    <title>Hyperlink Rel Attribute Properties</title>

</head>

<body>

    <p><b>Relative Hyperlink Properties</b></p>

    <p><a href=”https://www.vcanhelpsu.com” rel=”noopener noreferrer” target=”_blank”>Open Vcanhelpsu Wirh Rel Attributes</a></p>

</body>

</html>

Hyperlinking to sections within the same HTML web page.

आप अपने एचटीएमएल वेब पेज में टारगेट लिंक एलिमेंट पर हाइपरलिंक id ऐट्रिब्यूट्स का उपयोग करके अपने मौजूदा वेबपेज के अंदर किसी खास पैराग्राफ टेक्स्ट सेक्शन में एक से अधिक हाइपरलिंक क्रिएट कर सकते हैं.

<!– Target section link –>

<h2 id=”about html”>about html</h2>

<!– Link to the section –>

<a href=”#what is html”>Go to html Section </a>

<!DOCTYPE html>

<html lang=”en”>

<head>

    <meta charset=”UTF-8″>

    <meta name=”viewport” content=”width=device-width, initial-scale=1.0″>

    <title>Webpage Internal Link Tag</title>

</head>

<body>

    <p><a href=”#html”>Move To Html Link Section</a></p>

    <p><a href=”#Css”>Move To Css Link Section</a></p>

    <h1>Paragraph First</h1>

    <p>Css Used To Highly Customized Web Pages</p>

    <h1 id=”html”>Hyper Text Markup Language</h1>

    <p>Paragraph Second</p>

      <h1 id=”Css”>Css -Csscading Style Sheet</h1>

</body>

</html>

Linking to email addresses in an HTML web page.

यदि आप अपने वेब पेज कही भी ईमेल एड्रेस से लिंक क्रिएट करना चाहते है. तो आप  एचटीएमएल वेब पेज में ईमेल एड्रेस लिंक ईमेल एड्रेस को प्रॉपर टेक्स्ट इनफार्मेशन से लिंक कर क्रिएट करे।

<a href=”mailto:vcanhelps@gmail.com”>email to vcanhelpsu</a>

Creating a hyperlink from a phone number to a web page.

अपने एचटीएमएल वेब पेज में टेलीफोन हाइपरलिंक क्रिएट करने के लिए निचे दिए गए टेल हाइपरलिंक सिंटेक्स को प्रॉपर फॉलो करे.

<a href=”tel:+0121131314151″>Landline contact</a>

Email Hyperlink.

<!DOCTYPE html>

<html lang=”en”>

<head>

    <meta charset=”UTF-8″>

    <meta name=”viewport” content=”width=device-width, initial-scale=1.0″>

    <title>Telephone Hyperlink Tag</title>

</head>

<body>

    <p><b>Vcanhelpsu Website Simple Hyperlink</b></p>

    <p><a href=”tel:+0121131314151″>Landline contact</a></p>

</body>

</html>

Creating a file folder download link in a website.

एचटीएमएल वेब पेज में यदि आप फ़ाइलें डाउनलोड लिंक क्रिएट करना चाहते है, तो आप फाइल डाउनलोड प्रॉपर सर्वर डाउनलोड पथ ऐड कर क्लाइंट वेब ब्राउज़र में फाइलों को डाउनलोड करवाया जा सकता है.

<a href=”path/to/movie.mkv” download>Download movie File</a>

HTML Web Page Multiple Hyperlink Overview.

Basic Link Example.

<a href=”https://www.google.com”>open google</a>

Link URL link with a tooltip in an HTML web page.

<a href=”https://www.vcanhelpsu.com” title=”it move you on vcanhelpsu”>open vcanhelpsu</a>

Create open link in new tab in HTML web page.

<a href=”https://www.vcanhelpsu.com” target=”_blank” rel=”noopener noreferrer”>open website in new blank tab</a>

Create link to section on same page in HTML web page.

<a href=”#html”>move to html Section </a>

Create email link in HTML web page.

<a href=”mailto:vcanhelpsu@yahoo.com”>contact us</a>

Create phone link in HTML web page.

<a href=”tel:+1987654321″>Phone Us</a>

Create file download link in HTML web page.

<a href=”files/audio.mp3″ download>Download audio file</a>