لینک‌ها

از ویکی‌کد، دانشنامهٔ برنامه‌نویسی
(تغییرمسیر از لینک دهی در html)
پرش به ناوبری پرش به جستجو
Main Page Tutorial
Html-menu.png
موارد آموزشی
۱خانه
۲مقدمه
۳ویرایشگرها
۴پایه
۵عنصرها
۶ویژگی‌ها
۷عنوان‌ها
۸پاراگراف‌ها
۹استایل‌ها
۱۰قالب‌بندی
۱۱نقل‌قول‌ها
۱۲توضیحات
۱۳رنگ‌ها
۱۴CSS
۱۵لینک‌ها
۱۶تصاویر
۱۷جداول
۱۸لیست‌ها
۱۹بلوک‌ها
۲۰کلاس‌ها
۲۱شناسه
۲۲Iframeها
۲۳جاوا اسکریپت
۲۴مسیرهای فایل
۲۵سرصفحه
۲۶چیدمان‌ها
۲۷واکنش‌گرا
۲۸کد کامپیوتری
۲۹معنایی‌ها
۳۰راهنمای استایل
۳۱موجودیت‌ها
۳۲نماد‌ها
۳۳ایموجی‌ها
۳۴مجموعه کاراکترها
۳۵رمزگذاری URL
۳۶HTML و XHTML
فرم‌های HTML
گرافیک در HTML
رسانه در HTML
APIها در HTML
مثال‌ها
مرجع HTML

لینک‌ها تقریباً در همهٔ صفحات وب وجود دارند. لینک‌ها به کاربران این امکان را می‌دهند که از طریق آنها از صفحه ای به صفحه دیگر بروند.[۱]

لینک های HTML - ابرلینک ها (به انگلیسی: Hyperlinks)

لینک‌های HTML ابرلینک هستند.

می‌توان برروی یک لینک کلیک کنید و به سند دیگری منتقل شوید.

زمانیکه اشاره گر ماوس را روی یک لینک قرار دهید، فلش ماوس تبدیل به یک دست کوچک می‌شود.

توجه: لزومی ندارد که لینک حتماً از نوع متن باشد. می‌تواند یک تصویر یا عنصرهای HTML دیگر باشد.

لینک های HTML - شیوه نوشتار (به انگلیسی: Syntax)

ابرلینک‌ها با تگ <a> در HTML تعریف می‌شوند:

<a href="url">link text</a>

مثال

<a href="https://wikicod.ir/wiki/HTML:خانه">Visit our HTML tutorial</a>


مشاهدهٔ نتیجه


ویژگی href آدرس مقصد (https://wikicod.ir/wiki/HTML:خانه) لینک را مشخص می‌کند.

متن لینک بخش قابل رویت آن است (از آموزش HTML ما بازدید کنید).

کلیک کردن برروی متن لینک شما را به آدرس مشخص شده می‌فرستد.

توجه: بدون ممیز (به انگلیسی: Forward Slash) در انتهای آدرس‌های زیرپوشه (به انگلیسی: Subfolder)، ممکن است دو درخواست برای سرور تولید شود. بسیاری از سرورها بطور خودکار یک ممیز انتهای آدرس اضافه می‌کنند و سپس یک درخواست جدید ایجاد می‌کنند.

لینک های محلی

مثال بالا یک URL مطلق (یک آدرس کامل وب) را استفاده کرد.

یک لینک محلی (لینکی به همان وب‌سایت مثلا: HTML:خانه) با URL نسبی (بدون https://www...) مشخص می‌شود.

مثال

<a href="HTML:تصاویر">HTML Images</a>


مشاهدهٔ نتیجه


لینک‌های HTML - ویژگی target

ویژگی target تعیین می‌کند سند لینک شده در کجا باز شود.

ویژگی target می‌تواند یکی از مقدارهای زیر را داشته باشد:

  • _blank - سند لینک شده را در یک پنجره یا تب (Tab) جدید باز می‌کند
  • _self - سند لینک شده را در همان پنجره یا تب ای که روی آن کلیک شده باز می‌کند (حالت پیش‌فرض)
  • _parent - سند لینک شده را در فریم والد باز می‌کند
  • _top - سند لینک شده را در بدنه کامل پنجره باز می‌کند
  • framename - سند لینک شده را در فریم نام گذاری شده باز می‌کند

این مثال سند لینک شده را در یک پنجره / تب جدید مرورگر باز می‌کند:

مثال

<a href="https://wikicod.ir/" target="_blank">Visit WikiCod!</a>


مشاهدهٔ نتیجه


نکته: اگر صفحه وب شما در یک فریم قفل شده‌است، می‌توانید از target="_top" برای بیرون رفتن از فریم استفاده کنید:

مثال

<a href="https://www.w3schools.com/html/" target="_top">HTML5 tutorial!</a>


مشاهدهٔ نتیجه


لینک های HTML - تصویر بعنوان لینک

استفاده از تصاویر بعنوان لینک‌ها متداول است:

مثال

1 <a href="default.asp">
2   <img src="smiley.gif" alt="HTML tutorial" style="width:42px;height:42px;border:0;">
3 </a>


مشاهدهٔ نتیجه

توجه: border:0; در IE9 (و قدیمی‌تر) اضافه می‌شود تا از قرار دادن کادر در اطراف تصویر جلوگیری کند (زمانی‌که تصویر یک لینک است).

استفاده از دکمه به عنوان لینک

برای استفاده از دکمه در HTML به عنوان لینک، باید کد JavaScript را اضافه کنید.

جاوا اسکریپت به شما این امکان را می‌دهد تا آنچه که در رویدادهای خاص مانند کلیک بر یک دکمه اتفاق بیوفتد را مشخص کنید:

مثال

<button onclick="document.location = 'HTML:خانه'">HTML Tutorial</button>


مشاهدهٔ نتیجه


نکته: برای آموزش بیشتر JavaScript به آموزش جاوا اسکریپت مراجعه کنید.

عنوان های لینک

ویژگی title اطلاعات اضافی در مورد یک عنصر را مشخص می‌کند. این اطلاعات اکثر مواقع هنگام قرار گرفتن اشاره گر ماوس روی این عنصر بصورت متن tooltip نمایش داده می‌شود.

مثال

<a href="https://wikicod.ir/wiki/HTML:خانه" title="Go to WikCod HTML section">Visit our HTML Tutorial</a>


مشاهدهٔ نتیجه


مسیرهای خارجی

صفحات خارجی را می‌توان با URL کامل یا با مسیر مرتبطی به صفحه وب فعلی ارجاع داد.

این مثال از یک URL کامل برای لینک زدن به صفحه وب استفاده می‌کند:

مثال

<a href="https://wikicod.ir/wiki/HTML:خانه">HTML tutorial</a>


مشاهدهٔ نتیجه


این مثال به صفحهٔ قرار گرفته در پوشه html در همان وبسایت لینک می‌زند:

مثال

<a href="/html/default.asp">HTML tutorial</a>


مشاهدهٔ نتیجه


این مثال به صفحهٔ قرار گرفته در پوشهٔ همان صفحه لینک می‌زند:

مثال

<a href="default.asp">HTML tutorial</a>


مشاهدهٔ نتیجه

می‌توانید در مورد مسیرهای فایل در بخش مسیرهای فایل HTML بیشتر مطالعه کنید.

خلاصه بخش

  • از عنصر <a> برای تعریف یک لینک استفاده می‌شود
  • از ویژگی href برای تعریف آدرس لینک استفاده می‌شود
  • از ویژگی target برای تعیین اینکه سند لینک شده در کجا باز شود، استفاده می‌شود
  • از عنصر <img> (داخل <a>) برای به کار بردن تصویر بعنوان لینک استفاده می‌شود

تمرین های HTML

تگ های لینک HTML

تگ تعریف
<a> یک ابرلینک را مشخص می‌کند
برای دستیابی به لینک کامل همهٔ تگ‌های HTML، از مرجع تگ HTML ما بازدید کنید.


منابع آموزشی