آموزش HTML – لینکها

نوشته‌شده در در مفاهیم پایه ای
Loading Likes...

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

برای ایجاد لینک از تگ  (<anchor (<a  استفاده میکنیم و برای مشخص کردن آدرس مقصد باید اون رو در مشخصه  (href (Hypertext Reference بذاریم.

شما میتونید یک متن و یا تصویر رو با این روش به یک هایپرلینک (یا لینک) تبدیل کنید.

شکل کلی

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

بجای Link text متنی که باید بصورت لینک دار نمایش داده بشه و بجای url آدرس مقصد رو وارد میکنیم.

 

مثال ها

مثال اول لینک کردن متن

Hello! Please visit our 
<a href="http://www.tuts.irdevs.com/">tutorial center!</a>

خروجی:

Hello! Please visit our tutorial center!

 مثال دوم لینک کردن تصویر

برای اینکار کافیه بجای متن با استفاده از تگ <img> تصویر بذاریم:

Click on image to visit our tutorial center!<br/>
<a href="http://www.tuts.irdevs.com/">
	<img src="http://www.tuts.irdevs.com/wp-content/themes/tctheme/images/logo.png" alt="tc"/>
</a>

خروجی:

Click on image to visit our tutorial center!



اما توجه داشته باشید که برای همه المنت ها نمیتونید اینکارو بکنید البته ممکنه کار کنه اما در اینصورت طبق استاندارد W3C کد نویسی نکردید! برای مثال شما نمیتونید برای لینک دادن به یه دکمه (که با تگ <button> ایجاد میشه) اون رو داخل تگ <a> بذارید علتش اینه که تگ <a> المنت inline-level هست اما تگ <button> یک المنت Block-level و یک المنت Block-level نمیتونه داخل یک المنت inline-level قرار بگیره!

 

 



سوالی دارید؟

بدون گرفتن نتیجه اینجا رو ترک نکنید! هر سوالی دارید میتونید در عرض ۱۵ ثانیه ثبت نام و خیلی زود جواب بگیرید.

4 دیدگاه برای «آموزش HTML – لینکها»

    1. سلام
      http://www.tuts.irdevs.com/wp-content/themes/tctheme/images/logo.png
      آدرس عکسه که اپلود کردید یا از قبل اپلود شده.
      http://www.tuts.irdevs.com/
      لینکیه که با کلیک روی عکس وارد این آدرس میشه یعنی وقتی روی عکس کلیک میکنید وارد مرکز آموزش سافت افزار میشید.
      اطلاعات بیشتر:
      http://www.tuts.irdevs.com/html-tag-reference.html#anchor
      http://www.tuts.irdevs.com/html-tag-reference.html#img

پاسخی بگذارید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

61 − = 51