دنیای برنامه نویسی و اپلیکیشن

baner-telegram
شما اینجا هستید : صفحه اول » طراحی سایت » آموزش HTML » آموزش تگ لینک ( تگ a ) در HTML به صورت فیلم و متن
آموزش تگ لینک ( تگ a ) در HTML به صورت فیلم و متن

آموزش تگ لینک ( تگ a ) در HTML به صورت فیلم و متن

در این قسمت از فیلم آموزش HTML نحوه استفاده از تگ لینک یا همان تگ a را به شما آموزش خواهیم داد و شما می توانید ویدیو این قسمت را در ادامه مشاهده بکنید :

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

<a href="https://web30ty.com"> لینک </a>

برای درست کردن لینک از تگ a استفاده می کنیم ، حالا که لینک رو درستش کردیم باید آدرس لینک رو هم بدیم ، برای این کار از شناسه href استفاده می کنیم .

اگر کد بالا رو اجرا کنید ، در صفحه مرورگر به شما فقط لینک را نشان خواهد داد که با کلیک کردن بر روی اون به سایت ما هدایت خواهید شد .

پس اولین و مهم ترین شناسه تگ a شناسه href هست که آدرس لینک رو داخل اون می نویسیم . و هر چیزی که می خواهیم برای کاربر نشان داده شود رو بین دوتا تگ a می نویسیم .

رفتن از پایین صفحه به بالای صفحه یا بلعکس با استفاده از تگ لینک

حتما در سایت ها دید که وقتی به پایین صفحه میرید یه عکس یا نوشته هست که با کلیک کردن اون به اول همون صفحه برمی گردید . یا در بالای صفحه بر روی یه آیکون یا نوشته ایی کلیک می کنید و به پایین صفحه میره و اطلاعات مربوطه رو نشون میده این کار به وسیله تگ لینک انجام میشه .

کد زیر برای رفتن از بالا به پایین صفحه است :

<a href="#down"> لینک </a>

<br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br>

<p id="down">
اطلاعاتی که میشود در این جابه کاربر نشان داد
</p>

کد <br> برای فاصله گذاشتن و طولانی کردن صفحه هستش . وقتی بر روی لینک کلیک کنید به پایین صفحه هدایت خواهید شد .

بازگشت به بالا با استفاده تگ a

<a href="https://web30ty.com" name="top"> لینک </a>

<br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br>

<a href="#top">
بازگشت به بالا
</a>

در کد بالا وقتی روی بازگشت به بالا کلیک کنید به اول صفحه خواهد رفت . در اینجا اسمی که برای name و تگ a پایینی قرار می دید باید عین هم باشند .

در کد بالا به جای name می تونید از id هم استفاده کنید و یا اصلاً به جای تگ a در ابتدای صفحه از یه تگ p یا هر تگ دیگه ای که خواستید استفاده کنید ، به صورت زیر :

<p id="top"> لینک </p>

<br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br>

<a href="#top">
بازگشت به بالا
</a>

شناسه target در تگ a

این شناسه چهارچوب بازشدن لینک رو مشخص میکنه یعنی این لینکی که روش کلیک شده کجا باز بشه .

self_

<a href="https://web30ty.com"  target="_self"> وب سیتی </a>

این مقدار پیش فرض هستش و لینک رو در همون صفحه باز میکنه .

blank_

<a href="https://web30ty.com"  target="_blank"> وب سیتی </a>

از این مقدار برای باز کردن تگ a در یک تب جدید استفاده می شود .

لینک دادن به یک صفحه دیگر به وسیله تگ لینک

برای این کار باید دوتا فایل html درست کنید ، فرض کنید من دوتا فایل html به نام های header.html و index.html دارم و می خوام با کلیک کردن تگ لینک در صفحه هدر به صفحه ایندکس برم . برای این کار به صورت زیر عمل می کنیم :

<a href="index.html"  target="_blank"> صفحه ایندکس </a>

کد بالا رو در صفحه هدر قرار بدید . در اینجا فقط به جای لینک اسم فایل ایندکس رو دادیم همراه با پسوندش  . حالا اگه هر چیزی که در صفحه ایندکس باشه در یه تب جدید برای شما نشون داده خواهد شد .

فیلم آموزش تگ لینک رو می تونید از اینجا دانلود بکنید .

پیشنهاد می کنیم حتما بخوانید :

درباره : رضا طوماری

نظرات کاربران :


  1. mecharge گفت:

    ممنون عالی و کاربردی

جواب سوال چیه ؟ *