تگ a در HTML

با تگ a می توان، یک پیوند (لینک) درست کرد.

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

<a href="url">متن پیوند</a>

<a href="url">متن پیوند</a>

این تگ دارای ویژگی های زیادی است:

• ویژگی href: آدرس صفحه مقصد
• ویژگی target: نوع باز شدن پیوند را مشخص می کند
• ویژگی title: توضیحاتی به صورت نکته نظر (tooltip) در رابطه با صفحه مقصد

ساختار تگ a به صورت زیر است:

در واقع href آدرس صفحه مقصد را مشخص می کند.

<a href="https://pnldev.com">PNLdev</a>
<a href="https://www.google.com">Google</a>

<a href="https://pnldev.com">PNLdev</a>

<a href="https://www.google.com">Google</a>

در نمونه کد بالا، با کلیک روی google وارد سایت گوگل می شویم  و با کلیک بر PNLdev وارد سایت PNLdev می شویم.

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

<a href="https://pnldev.com">
   <img src="https://pnldev.com/storage/refrence/category/html.png" alt="image html">
</a>

<a href="https://pnldev.com">

   <img src="https://pnldev.com/storage/refrence/category/html.png" alt="image html">

</a>

همانطور که در نمونه کد بالا می بینید، داخل تگ a از تگ img به صورت تودرتو (nested) استفاده شده است.

در واقع تصویر خاصیت پیوند شدن را گرفته است.

نکته: برای اطلاعات بیشتر درباره ی آدرس دهی به صفحه آدرس دهی HTML مراجعه کنید.

یکی دیگر از ویژگی هایی که تگ a دارد ویژگی target است.

این ویژگی نحوه باز شدن صفحه را مشخص می کند. آیا در همان صفحه یا در صفحه دیگری باز شود.

برای درک بهتر روی پیوند های نمونه کد زیر کلیک کنید.

<a href="https://pnldev.com" target="_self"></a>   
<a href="https://pnldev.com" target="_blank"></a>   
<a href="https://pnldev.com" target="_parent"></a>   
<a href="https://pnldev.com" target="_top"></a>

<a href="https://pnldev.com" target="_self"></a>   

<a href="https://pnldev.com" target="_blank"></a>   

<a href="https://pnldev.com" target="_parent"></a>   

<a href="https://pnldev.com" target="_top"></a>

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

_self: در همان صفحه باز می شود. (پیشفرض)

_blank: در صفحه دیگری (new tab) باز می شود.

_top: در بالاترین صفحه باز می شود. (برای اطلاع بیشتر از این مقدار به صفحه ویژگی target بروید)

_parent: مقصد لینک را در والد iframe باز می کند. (برای اطلاع بیشتر از این مقدار به صفحه ویژگی target بروید)

ویژگی title در تگ a، باعث ایجاد نکته ابزار(tooltip) می شود. با نگه داشتن ماوس روی پیوند، متن درون title نمایش داده می شود.

ویژگی title، یک ویژگی سراسری می باشد و در تگ های دیگر هم قابل استفاده است.

معمولا در ویژگی title، اطلاعاتی درباره صفحه مقصد گذاشته می شود.

<a href="https://pnldev.com" title="سایت PNLdev"></a>

<a href="https://pnldev.com" title="سایت PNLdev"></a>

با تگ a در HTML می توان به یک شماره تلفن لینک داد.

برای ایجاد باید از ترکیب tel:phone number در تگ <a> استفاده کنید.

<a href="tel:09120000000">تماس با ما</a>

<a href="tel:09120000000">تماس با ما</a>

نکته:  اگر کاربر در گوشی موبایل، روی تگ a کلیک کند. با آن شماره موبایل وارد بخش تماس ها می شود.

این کاربرد معمولا برای موبایل و تبلت ها به کار می رود.

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

برای ایجاد باید از ترکیب mailto:email address در تگ <a> استفاده کنید.

<a href="mailto:emailaddress@example.com">ارسال ایمیل</a>

<a href="mailto:emailaddress@example.com">ارسال ایمیل</a>