لینکهای HTML
- صفحه قبلی CSS HTML
- صفحه بعدی تصاویر HTML
HTML کا استعمال انٹرنیٹ پر دوسرے ڈاکومن سے لنک قائم کرنے کے لئے کیا جاتا ہے。
سارے ویب پیج میں لنک مل سکتا ہے۔ لنک پر کلک کرکے ایک پیج سے دوسرے پیج پر چل سکتا ہے。
مثال
- سوپر لنک بنائیں
- اس مثال میں HTML ڈاکومن میں لنک بنانے کا دکھایا گیا ہے。
- تصویر کو لنک کے طور پر استعمال کریں
- اس مثال میں تصویر کو لنک کے طور پر استعمال کا دکھایا گیا ہے。
HTML سوپر لنک (لنک)
سوپر لنک ایک الفاظ، یا ایک جملہ، یا ایک سلسلہ الفاظ کا ہوا سکتا ہے، یا ایک تصویر بھی، آپ ان مواد پر کلک کر سکتے ہیں تاکہ نئے ڈاکومن یا موجودہ ڈاکومن کا کسی حصے کو چل سکتا ہو。
جب آپ کا موس پوائنٹر ویب پیج میں کسی لنک پر بھیجتا ہے تو پوائنٹر کا پتھر ایک چھوٹا ہاتھ بن جاتا ہے。
ہم <a> تگ کا استعمال کے ذریعے HTML میں لنک بناتے ہیں。
دو روش برای استفاده از برچسب <a> وجود دارد:
- با استفاده از ویژگی href - ایجاد لینک به مستند دیگری
- با استفاده از ویژگی name - ایجاد نشانگذار در داخل مستند
خواندن بیشتر:چه چیزی به عنوان HyperText است؟
نحوهی لینکدهی HTML
کد HTML لینک ساده است. شبیه این است:
<a href="url">نوشته لینک</a>
ویژگی href مشخص میکند که هدف لینک چیست.
نوشته بین برچسبهای شروع و پایان به عنوان لینک نمایش داده میشود.
مثال
<a href="http://www.codew3c.com/">برای دیدن CodeW3C.com مراجعه کنید</a>
این خط کد به این صورت نمایش داده میشود:برای دیدن CodeW3C.com مراجعه کنید
با کلیک بر روی این لینک کاربر به صفحه اصلی CodeW3C.com هدایت میشود.
توجه:"نوشته لینک" لزوماً باید نوشته باشد. تصاویر یا عناصر HTML دیگر نیز میتوانند لینک باشند.
HTML لینک - ویژگی target
با استفاده از ویژگی Target، میتوانید تعیین کنید که مستند لینک شده کجا نمایش داده شود.
این خط در یک پنجره جدید مستند را باز میکند:
<a href="http://www.codew3c.com/" target="_blank">برای دیدن CodeW3C.com مراجعه کنید!</a>
HTML لینک - ویژگی name
ویژگی name مشخص میکند که نام آنکر چیست.
آپ میتوانید از ویژگی name برای ایجاد نشانگذار در صفحات HTML استفاده کنید.
نشانگذار به هیچ وجه به صورت خاص نمایش داده نمیشود، و برای خوانندگان قابل مشاهده نیست.
وقتی از آنکرهای نامگذاری شده (named anchors) استفاده میکنیم، میتوانیم لینکهایی ایجاد کنیم که مستقیماً به آنکرهای نامگذاری شده (مثلاً بخشهای کوچکی از صفحه) بروند، بنابراین کاربران نیاز به پیچیدن مداوم صفحه ندارند تا به اطلاعات مورد نظرشان برسند.
نحوهی نامگذاری آنکر:
<a name="label">آنکر (نوشتهای که روی صفحه نمایش داده میشود)</a>
توجه:نام آنکر میتواند هر نامی باشد که دوست دارید.
توجه:آپ میتوانید از ویژگی id به جای ویژگی name استفاده کنید، نامگذاری آنکر همچنان معتبر است.
مثال
ابتدا، ما در مستند HTML به آنکر نام میدهیم (یک نشانگذار ایجاد میکنیم):
<a name="tips">موارد اولیه - نکات مفید</a>
سپس، ما در همان مستند به آنکر لینک ایجاد میکنیم:
<a href="#tips">نکات مفید</a>
آپ میتوانید در صفحات دیگر نیز لینکهایی به این آنکر ایجاد کنید:
<a href="http://www.codew3c.com/html/html_links.asp#tips">نکات مفید</a>
در کد بالا، ما نشانه # و نام نقطه آشکارساز را به پایان URL اضافه کردهایم تا بتوانیم مستقیماً به نقطه آشکارساز 'tips' لینک دهیم.
تأثیر خاص:نکات مفید
نکات اولیه - نکات مفید:
توجه:لطفاً همیشه کرونومتر را به پوشههای فرزند اضافه کنید. اگر اینگونه لینک بنویسید: href="http://www.codew3c.com/html"، دو درخواست HTTP به سرور ایجاد خواهد شد. این دلیل این است که سرور کرونومتر را به این آدرس اضافه میکند و سپس درخواست جدیدی ایجاد میکند، مانند این: href="http://www.codew3c.com/html/".
توجه:نقطه آشکارساز نامگذاری شده اغلب برای ایجاد فهرست در ابتدای مستندهای بزرگ استفاده میشود. میتوان برای هر فصل یک نقطه آشکارساز نامگذاری کرد و لینکهایی که به این نقطهها لینک دارند را در بالای مستند قرار داد. اگر به ویکیپدیا مراجعه کنید، خواهید دید که تقریباً هر واژه دارای این نوع هدایتکننده است.
توجه:اگر مرورگر نتواند نقطه آشکارساز تعریف شده را پیدا کند، به ابتدای مستند خواهد رفت. هیچ خطایی رخ نخواهد داد.
مثالهای بیشتر
- لینک در پنجره جدید مرورگر باز کردن
- این مثال نمایش میدهد که چگونه میتوان یک صفحه را در پنجره جدید مرورگر باز کرد تا بازدیدکنندگان نیازی به ترک وبسایت شما نداشته باشند.
- لینک به موقعیتهای مختلف یک صفحه
- این مثال نمایش میدهد که چگونه میتوان به بخش دیگری از مستند از طریق لینک دسترسی پیدا کرد
- جابجایی از فریم
- این مثال نمایش میدهد که چگونه میتوان از لینک برای جابجایی به بخش دیگری از مستند استفاده کرد.
- ایجاد لینک ایمیل
- این مثال نمایش میدهد که چگونه به یک ایمیل لینک داده میشود. (این مثال پس از نصب برنامه مشتری ایمیل کار میکند.)
- ایجاد لینک ایمیل 2
- این مثال نمایش میدهد که چگونه یک لینک ایمیل پیچیدهتر ایجاد میشود.
برچسب لینک HTML
برچسب | توضیح |
---|---|
<a> | تعریف نقطه آشکارساز. |
- صفحه قبلی CSS HTML
- صفحه بعدی تصاویر HTML