لینک‌ها
لینک‌ها تقریباً در همهٔ صفحات وب وجود دارند. لینک‌ها به کاربران این امکان را می‌دهند که از طریق آنها از صفحه ای به صفحه دیگر بروند.[۱]
محتویات
- ۱ لینک های HTML - ابرلینک ها (به انگلیسی: Hyperlinks)
- ۲ لینک های HTML - شیوه نوشتار (به انگلیسی: Syntax)
- ۳ لینک های محلی
- ۴ لینک‌های HTML - ویژگی target
- ۵ لینک های HTML - تصویر بعنوان لینک
- ۶ استفاده از دکمه به عنوان لینک
- ۷ عنوان های لینک
- ۸ مسیرهای خارجی
- ۹ خلاصه بخش
- ۱۰ تمرین های HTML
- ۱۱ تگ های لینک HTML
- ۱۲ منابع آموزشی
لینک های HTML - ابرلینک ها (به انگلیسی: Hyperlinks)
لینک‌های 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 ما بازدید کنید).
کلیک کردن برروی متن لینک شما را به آدرس مشخص شده می‌فرستد.
لینک های محلی
مثال بالا یک 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>
عنوان های لینک
ویژگی 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>
خلاصه بخش
- از عنصر
<a>برای تعریف یک لینک استفاده می‌شود
- از ویژگی
hrefبرای تعریف آدرس لینک استفاده می‌شود
- از ویژگی
targetبرای تعیین اینکه سند لینک شده در کجا باز شود، استفاده می‌شود
- از عنصر
<img>(داخل <a>) برای به کار بردن تصویر بعنوان لینک استفاده می‌شود
تمرین های HTML
تگ های لینک HTML
| تگ | تعریف |
|---|---|
| <a> | یک ابرلینک را مشخص می‌کند |
منابع آموزشی