نحوه ایجاد پیوند یا لینک در HTML

علیرضا حاتمی نیا 1395/9/24 3100

نحوه ایجاد پیوند یا لینک در HTML

عرض سلام و خسته نباشید خدمت شما علاقه مندان به آموزش طراحی وب
علیرضا حاتمی نیا هستم با آموزش قسمت ششم طراحی وب HTML , CSS در خدمت شما هستم.
در جلسه قبل نحوه نمایش تصویر در وب را آموختید. در این جلسه با نحوه ایجاد پیوند(لینک) در صفحه وب آشنا خواهید شد.
قبل از اینکه برچسب ایجاد پیوند در صفحه وب را معرفی کنیم، لازمه است تا کمی با مفهوم پیوند آشنا می  شوید.

پیوند یا لینک Link :
منظور از پیوند یا HyperLink متن یا تصویری ست که امکان کلیک کردن را برای کاربر ایجاد می کند. در حالت معمولی هنگامی که کاربر موس خود را به روی لینک میبرد ، نشانه گر موس به صورت دست تغییر شکل می دهد و کاربر پس از کلیک به روی لینک به نشانی دیگری هدایت می شود. مثلا کاربر هنگام کلیک به روی لینک "تماس با ما" به صفحه تماس با ما هدایت و منتقل میشود.

برچسب <a> :
واژه a  ار عبارت anchor به معنی لنگر گرفته شده است. برچسب <a> دارای تگ پایانی </a> می  باشد و متنی که بین دو تگ باز و بسته <a></a> قرار می گیرد به صورت لینک نمایش داده می شود.
<a> this is link </a>


مشخصه href :
تگ <a> دارای یک مشخصه اجباری با نام href است که مقدار آن برابر با آدرسی ست که کاربر پس از کلیک به روی لینک به آن منتقل میشود. href  مخفف عبارت hypertext reference  می باشد. بدون تعریف این مشخصه لینک ایجاد نخواهد شد.

 

<a href=”web.html”> this is link </a>

 

نمایش اجرای تگ <a>


مشخصه target :
همچنین تگ <a> دارای یک خصیصه اختیاری ولی کاربردی به نام target است که مقادیر آن تعیین می کنند که کاربر چگونه به آدرس مورد نظر هدایت شود. مقادیر target عبارتند از _top,_parent,_self,_blank
در مورد _top و _parent در جلسات آینده بیشتر آشنا خواهید شد. مقدار _self که به صورت پیشفرض فعال است و باعث می شود تا کاربر پس از کلیک در همان صفحه به صفحه جدید هدایت شود و مقدار _blank باعث می شود تا کاربر در برگه ای جدید از مرورگر به صفحه جدید منتقل شود.
نکته : برای اینکه یک عکس را به صورت لینک تبدیل کنیم کافیست تا تگ نمایش عکس را بین تگ <a></a> قرار دهیم:

 

<a href=”about.html”>
<img src=”logo.jpg”>
</a>


نکته:
برای اینکه کاربر را به سایتی خارجی لینک دهیم کافیست آدرس اینترنتی صفجه مورد نظر را به href اختصاص دهیم. توجه داشته باشید که حتما عبارت http:// قبل از آدرس مورد نظر نوشته شود.
مثلا فرض کنید می خواهیم توسط لینکی کاربر را به به سایت گوگل هدایت کنیم.

 

<a href=http://google.com > google </a>

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

دانلود ویدیو

 

 

 

قسمت بعدی قسمت قبلی