Introduction to HTML Links
एक link ऐसा text या image होती है जिस पर click करते ही आप दूसरे page पर redirect कर दिए जाते है। जब भी आप किसी link पर अपना cursor ले जाते है तो वह एक clickable hand icon में convert हो जाता है। Links का उपयोग basically एक page से दूसरे page पर जाने के लिए किया जाता है। Links web की दुनिया की roads होती है।
HTML में link create करने के लिए <a> tag यूज़ किया जाता है। इसे anchor tag कहा जाता है। इस tag के सबसे basic attributes href और target होते है। इन दोनों attributes के बारे में नीचे बताया गया है।
href
इस attribute के द्वारा आप उस page का address define करते है जो आप link के click होने पर show करना चाहते है।
href = “page-Address” |
target
target – इस attribute के द्वारा आप वह frame define करते है जँहा पर आप page शो करना चाहते है। ये attribute optional होता है। यदि आप इसे define नहीं करते है तो page new tab में open होता है। इस attribute कि कुछ predefined values होती है जिन्हें आप use कर सकते हैं।
target = “frame-Name” |
- _blank – जब आप ये value define करते है तो आपका webpage new tab या window में open होता है।
- _self – जब आप ये value define करते है तो आपका webpage उसी tab या frame मे open होता है जिसमें link पर click किया गया था।
- _parent – ये value webpage को parent frame में open करती है।
- _top – इस value के द्वारा web page full document में open होता है।
- customFrame – आप खुद का भी कोई frame define कर सकते है। ऐसा करने पर webpage उसी मे open होगा।
Creating Links in HTML
जैसा की मैने आपको बताया की HTML के द्वारा link create करने के लिए आप <a> tag यूज़ करते है। यँहा पर में आपको इसे कैसे यूज़ करते है ये बताने वाला हूँ। आइये इस tag का normal structure देखते है।
<a href=”address-of-webpage> link-Name </a> |
HTML में links create करने का complete उदाहरण नीचे दिया जा रहा है।
<html>
<head> <title>Text Formatting</title> </head> <body> <p> Go to Google <a href=”www.google.com”>Click Here</a> </p> <p> Go to Best Hindi Tutorials <a href=”www.besthinditutorials.com”>Click Here</a> </p> <p> Go to Facebook <a href=”www.facebook.com”>Click Here</a> </p> </body> </html> |
ऊपर दी गयी script को run करने पर निचे दिया गया web page generate होगा।
Configuring Links
Links को आप अपने page के according configure भी कर सकते है। जैसे की आप apply कर सकते है की जब भी कोई link पर mouse ले जाये तो उसका color green हो जाये और mouse हटाते ही red हो जाये। ये सब आप style tag के द्वारा कर सकते है। इसके लिए आप a के साथ condition colon लगाकर define करते है। इनके बारे में नीचे दिया जा रहा है। इनका उदाहरण आप CSS वाली tutorials में देख सकते है।
Condition | Explanation |
a:link | इस condition में link first time web page पर show होती है। |
a:visited | इस condition में link पहले visit कि जा चुकी होती है। |
a:hover | इस condition में link पर cursor ले जाया जाता है। |
a:active | जब आप किसी link पर click करते है तो वह link active होती है। |