HTML লিঙ্ক
- পূর্ববর্তী পৃষ্ঠা HTML CSS
- পরবর্তী পৃষ্ঠা HTML চিত্র
HTML সুপার লিঙ্ক ব্যবহার করে ওয়েবের অন্য ডকুমেন্টের সাথে সংযুক্ত হয়
সম্মুখপাসের সব ওয়েবসাইটে লিঙ্ক পাওয়া যায়। লিঙ্ক ক্লিক করলে, একটি পাতা থেকে আরেকটি পাতায় যাবে।
উদাহরণ
- সুপার লিঙ্ক তৈরি
- এইমুকুল দেখে আপনি একটি HTML ডকুমেন্টে কিভাবে লিঙ্ক তৈরি করতে পারেন তা দেখুন
- ছবিকে লিঙ্ক হিসাবে ব্যবহার
- এইমুকুল দেখে আপনি একটি ছবিকে লিঙ্ক হিসাবে কিভাবে ব্যবহার করতে পারেন তা দেখুন
HTML সুপার লিঙ্ক (লিঙ্ক)
সুপার লিঙ্ক একটি শব্দ, একটি কথা, বা একটি শব্দগুচ্ছও হতে পারে, এবং একটি ছবিও হতে পারে; আপনি এই কোনও কিছুকে ক্লিক করলে, তা একটি নতুন ডকুমেন্ট বা একটি ডকুমেন্টের কোনও অংশে যাবে।
যখন আপনি ওয়েবসাইটের একটি লিঙ্কের উপর মাউস ইন্ডিকেটর নিয়ে যান, তখন তা একটি ছোট হাতের আকৃতির হয়ে ওঠে।
আমরা এইমুকুল লিঙ্ক তৈরি করতে <a> ট্যাগ ব্যবহার করি।
ট্যাগ <a> এর দুটি ব্যবহার পদ্ধতি আছে:
- href অ্যাট্রিবিউট ব্যবহার করে - আরেকটি ডকুমেন্টের লিঙ্ক তৈরি করা
- name অ্যাট্রিবিউট ব্যবহার করে - ডকুমেন্টের ভিতরে বুকমার্ক তৈরি করা
আরও পড়ুন:সুপারটেক্সট কি?
HTML লিঙ্ক সুত্র
লিঙ্কের HTML কোডটি অত্যন্ত সরল
<a href="url">Link text</a>
href অ্যাট্রিবিউটটি লিঙ্কের লক্ষ্য নির্দিষ্ট করে。
শুরুতের ট্যাগ এবং শেষতের ট্যাগের মধ্যে বাক্য সুপার লিঙ্ক হিসাবে দেখা যাবে。
উদাহরণ
<a href="http://www.codew3c.com/">ভ্রমণ করুন CodeW3C.com</a>
উপরোক্ত সূত্রটি এইভাবে দেখা যাবে:Visit CodeW3C.com
এই সুপার লিঙ্কটি ব্যবহার করে ব্যবহারকারীকে CodeW3C.com এর হোম পেজে পৌঁছাবে。
পরামর্শ:"লিঙ্ক টেক্সট" কেবল টেক্সট হতে পারে না, ছবি বা অন্য এইচটিএমএল ইলেমেন্টও লিঙ্ক হয়ে থাকতে পারে。
HTML লিঙ্ক - target অ্যাট্রিবিউট
Target অ্যাট্রিবিউট ব্যবহার করে আপনি লিঙ্ককৃত ডকুমেন্টটিকে কোথায় দেখাতে পারেন。
এই সূত্রটি একটি নতুন উইন্ডোতে ডকুমেন্টটি খুলবে:
<a href="http://www.codew3c.com/" target="_blank">Visit CodeW3C.com!</a>
HTML লিঙ্ক - name অ্যাট্রিবিউট
name অ্যাট্রিবিউটটি আঙ্কন (anchor) এর নাম নির্দিষ্ট করে。
আপনি name অ্যাট্রিবিউটটি ব্যবহার করে HTML পৃষ্ঠায় বুকমার্ক তৈরি করতে পারেন。
বুকমার্ক কোনও বিশেষ পদ্ধতিতে দেখা যায় না, এটি পাঠককে দেখা যায় না。
যখন নামকরণকৃত আঙ্কন (named anchors) ব্যবহার করা হয়, তখন আমরা এমন লিঙ্ক তৈরি করতে পারি যা সরাসরি নামকরণকৃত আঙ্কনে (যেমন, পৃষ্ঠার কোনও সেকশনে) হয়, যার ফলে ব্যবহারকারীকে পৃষ্ঠা ধরে ধরে চলে তাদের চাইতে যে তথ্য খুঁজতে হবে তা খুঁজার জন্য নয়。
নামকরণকৃত আঙ্কনের সুত্র:
<a name="label">আঙ্কন (পৃষ্ঠায় দেখা যাবে)</a>
পরামর্শ:আঙ্কনের নাম আপনার পছন্দ হতে পারে。
পরামর্শ:আপনি id অ্যাট্রিবিউটটি নাম অ্যাট্রিবিউটটির পরিবর্তে ব্যবহার করতে পারেন, নামকরণকৃত আঙ্কনও কার্যকরি হবে。
উদাহরণ
প্রথমে, HTML ডকুমেন্টে আমরা আঙ্কনকে নামকরণ করি (একটি বুকমার্ক তৈরি করি):
<a name="tips">মৌলিক নীতি - সুবিধাপূর্ণ টিপস</a>
তারপর আমরা একই ডকুমেন্টে এই আঙ্কনকে লিঙ্ক করি:
<a href="#tips">সুবিধাপূর্ণ টিপস</a>
আপনি অন্য পৃষ্ঠায়ও এই আঙ্কনকে লিঙ্ক করতে পারেন:
<a href="http://www.codew3c.com/html/html_links.asp#tips"">有用的提示
在上面的代码中，我们将 # 符号和锚名称添加到 URL 的末端，就可以直接链接到 tips 这个命名锚了。
বিশেষ প্রভাব:উপযুক্ত পরামর্শ
মৌলিক দৃষ্টিভঙ্গি - উপযুক্ত পরামর্শ:
মন্তব্য:প্রত্যেকটি সাব-ফোল্ডারে সমস্তক্রম সমাপ্ত করুন।যদি এইভাবে লিঙ্ক লিখেন: href="http://www.codew3c.com/html" তবে সার্ভারকে এই ঠিকানায় দুইবার HTTP রিকোর্ড পদ্ধতি চালু করবে।কারণ সার্ভার এই ঠিকানায় সমস্তক্রম যোগ করবে, এবং একটি নতুন রিকোর্ড পদ্ধতি তৈরি করবে, যেমন: href="http://www.codew3c.com/html/"
পরামর্শ:নামকরণকৃত অ্যাঙ্কারটি সাধারণত বড় ডকুমেন্টের শীর্ষে তালিকা তৈরির জন্য ব্যবহৃত হয়।প্রত্যেক চ্যাপটারের জন্য একটি নামকরণকৃত অ্যাঙ্কার দেওয়া হয়, এবং এই অ্যাঙ্কারগুলির লিঙ্কগুলি ডকুমেন্টের উপর স্থাপিত হয়।যদি আপনি বিশ্ববিদ্যালয়ের ভিকিপিডিয়াকে বেশিরভাগই পরিদর্শন করেন, তবে আপনি পাবেন যে প্রায় প্রত্যেক নিবন্ধই এই নেভিগেশন পদ্ধতিকে ব্যবহার করে
পরামর্শ:যদি ব্রাউজারটি নামকরণকৃত অ্যাঙ্কারটি পাওয়া যায় না, তবে ডকুমেন্টের শীর্ষে লোকেশন করা হবে।কোনও ত্রুটি ঘটবে না。
আরও উদাহরণ
- নতুন ব্রাউজার উইন্ডোতে লিঙ্ক খুলতে
- নতুন ব্রাউজার উইন্ডোতে লিঙ্ক খুলতে
- একই পৃষ্ঠার ভিন্ন অংশে লিঙ্ক
- এই উদাহরণটি দেখায় কিভাবে লিঙ্ক ব্যবহার করে ডকুমেন্টের অন্যান্য অংশে জুমকরা হয়
- ফ্রেম বেরিয়ে আসা
- এই উদাহরণটি দেখায় কিভাবে ফ্রেমতে বেরিয়ে আসা হয়, যদি আপনার পাতা ফ্রেমে আবদ্ধ হয়ে থাকে。
- ইমেইল লিঙ্ক তৈরি
- এই উদাহরণটি দেখায় কিভাবে একটি ইমেইল লিঙ্কে লিঙ্ক করা হয়।(এই উদাহরণটি ইমেইল ক্লায়েন্ট প্রোগ্রাম ইনস্টল করা পরেই কাজ করবে।)
- ইমেইল লিঙ্ক তৈরি 2
- এই উদাহরণটি আরও জটিল ইমেইল লিঙ্কটি দেখায়。
HTML লিঙ্ক ট্যাগ
| ট্যাগ | বর্ণনা |
|---|---|
| <a> | অ্যাঙ্কার সংজ্ঞা |
- পূর্ববর্তী পৃষ্ঠা HTML CSS
- পরবর্তী পৃষ্ঠা HTML চিত্র
