برای پیدا کردن مطالب آموزشی در وب سایت ، لطفاً کلمات کلیدی آن مطلب را سرچ کنید.

به وب سایت حباب ها خوشامدید | ما را در شبکه های اجتماعی دنبال کنید:

آموزش تگ a در HTML

  /  HTML   /  تگ ایجاد لینک در HTML
آموزش تگ های HTML | آموزش HTML | آموزش کامل HTML | تگ html

تگ ایجاد لینک در HTML


در این آموزش به روش کار با لینک ها ، تگ ایجاد لینک در html یا همان تگ a می پردازیم.

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

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

تگ a در HTML (ایجاد لینک):

تگ a به طور پیش فرض یک لینک دارای سه حالت ظاهری می باشد:

  • لینکی که هنوز کلیک نشده ( آبی رنگ است و زیرش خط دارد )
  • لینکی که کلیک شده ( زیرش خط کشیده شده و رنگش بنفش می باشد )
  • لینکی که فعال است ( قبلاً روی آن کلیک شده و رنگ قرمز دارد )

این ویژگی های ظاهری پیش فرض با استفاده از کد های css و javascript قابل تغییر است.

قبل از شروع مثال های آموزش ، شما باید تست آنلاین کد حباب ها رو باز کرده و این مثال هارو به صورت عملی تست کرده و آزمایش کنید.

بسیار خب ، مثل همیشه آموزش رو با مثال پیش میبریم ، به مثال زیر توجه کنید:

خب همان طور که در مثال بالا مشاهده میکنید تگ a به این شکل اجرا می شود:

address:

address در تگ لینک ، شما به جای address باید مسیری که قراره کاربر خودتون رو بهش هدایت کنید وارد کنید دقت کنید که برای انتقال به یک مسیر از خاصیت

استفاده کردیم.

address ما میتونه URL خاصی باشه یا یک هشتگ برای رفتن به یک مکان خاص از صفحه وب و…

Your text:

و اما your text در تگ لینک ، این مهم ترین بخش یک لینک هست.

شما می تونید بجای your text هر کدی قرار بدید که در نتیجه اون کد تبدیل به لینک میشه ، یعنی میتونید بجای your text یک متن قرار داده یا یک عکس یا هر چیز دیگر…

و کاربر با کلیک کردن بر روی اون هدایت میشه به مسیری که مشخص کردید…

تا اینجا توانستیم یک لینک ساده برای خود بسازیم در ادامه به جزئیات بیشتری اشاره خواهیم کرد.

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

اگر قصد دارید که لینک شما در یک صفحه دیگر باز شود و یا به هرشکل دیگر باید از خاصیت target استفاده کنید ، به مثال زیر دقت کنید:

این کد را داخل تست آنلاین کد حباب ها تست کنید تا خروجی را بهتر درک کنید.

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

در تگ a استفاده کردیم.

مقدار های target در تگ a:

بسیار خب ، مقدار هایی که خاصیت target در تگ لینک میگیرد به این صورت است:

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

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

راستی اگر نکته ای رو از قلم انداختیم حتماً کامنت بزارید و به ما اطلاع بدید.

مدیر حباب ها

متین برونسی مدیر و مؤسس حباب ها می باشد ، او علاقه مند به دنیای کامپیوتر و زبان های برنامه نویسی است... از تخصص های او می توان به برنامه نویسی frontend و backend اشاره کرد... او تجربیات زیادی در زبان های برنامه نویسی مختلف دارد... ، او گاهاً تجربیات خود را در قالب آموزش در وب سایت حباب ها منتشر می کند...

دیدگاه
  • یاسر 09/09/2019 23:47

    خیلی جامع و کامل ، دمتون گرم

    پاسخ
  • بی نام 09/09/2019 23:48

    خوب بود 👌👌👌

    پاسخ
  • کاربر 09/09/2019 23:49

    عالیییییییییی 💖💖

    پاسخ
ارسال یک نظر