آموزش html5 و css3 جلسه ۶ تگ a برسی تمام اتریبیوت های a

مطالب پیشنهادی برای شما مهمان عزیز

بنام خدا ,

یکی از مهم‌ترین اجزای صفحات وب لینک‌ها هستند،
لینک‌ها به ما کمک می‌کنند تا صفحات مختلف اینترنتی را به هم متصل کرده و راحت‌تر در وب به گشت و گذار بپردازیم،
در این آموزش از آموزش HTML5 و CSS3 به بررسی تگ لینک و ویژگی‌های آن می‌پردازیم در پایان این نوشته شما خواهید توانست در صفحات اچ‌تی‌ام‌ال خود از لینک‌ها استفاده کنید یا اصطلاحا به صفحات مختلف اینترنتی لینک بدهید.

آموزش html5 و css3 جلسه ۶ تگ a برسی تمام اتریبیوت های a

به طور پیش فرض، لینک ها در مرورگرها به یکی از روش های زیر، ظاهر می شوند:

[checklist]

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

[/checklist]

آموزش HTML و CSS

به تصویر بالا دقت کنید لینک ها در HTML به این صورت قرار میگریند که تمام مقادیرشان  کامل برسی می کنیم.

برای ایجاد لینک باید از تگ a به شکل زیر استفاده کرد . a ابتدای کلمه anchor به معنای لنگر است . تگ a دارای ۴ attribute پر کاربرد است

اتریبیوت ها

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

download

این اتریبیوت به مرورگر میگوید بجای اینکه به یک URL برود آنرا دانلود کند و درنتیجه پنجره ذخیره فایل برای کاربر نمایش داده میشود.
اگر اتریبیوت مقدار داشته باشد، بعنوان نام پیش فرض درنظر گرفته شود (البته کاربر میتواند آن نام را تغییر دهد).
هیچ محدودیتی برای نام مقادیر وجود ندارد، هرچند / و \ تبدیل به _ میشود.
خیلی از فایلهای سیستمی برای نامگذاری محدودیت دارند و بنابراین مرورگراها این محدودیتها را رعایت میکنند.

بیشتر بخوانید :
آموزش طراحی قالب html و css طراحی بخش سایدبار استایل خبرنامه | پاسخ وردپرس |

href

برای لینک حدف استفاده می شوند

آموزش html and css

fragment URL نامی است که پس از # می آید. # به بخشی یا قسمتی از همان صفحه (یک id از المان HTML) دلالت دارد.
URL ها محدود به داکیومنت های HTTP وبی نیستند،
اما میتوانند از هر پروتکلی که توسط مرورگرها پشتیبانی میشوند استفاده کنند.
برای مثال file:، ftp: و mailto: توسط اکثر مرورگرها پشتیبانی میشوند.

rel

ارتباط آبجکت هدف به آبجکت لینک را مشخص میکند. مقدار آن لیستی از انواع لینکها می باشد که با space از هم جدا شده اند.

برخی از مقادیر rel

[checklist]

  • alternate
  •  author
  • bookmark
  • help
  • license
  • next
  • nofollow
  • noreferrer
  • prefetch
  • prev
  • search
  • tag

[/checklist]

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

target

[thumbup]

  • ۱ : _self باعث میشود که URL در پنجره یا تبی که کلیک شده است باز شود (مقدار پیش فرض).
  • ۲ : _blank باعث میشود که URL در پنجره یا تب جدید باز شود.
  • ۳ : _parent باعث میشود URL در فریم بالایی یا parent باز شود.
  • ۴ : _top باعث میشود URL بصورت صد در صدی باز شود. اگر صفحه وب درون یک فریم قفل شده باشد میتوانید در target از این کلمه کلیدی استفاده کنید.
بیشتر بخوانید :
آموزش HTML و CSS آشنایی با CSS Float جلسه 15 | پاسخ وردپرس |

[/thumbup]

ایجاد عنوان برای لینک یا title

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

ایجاد لینک به یک تصویر

hypertext یا متن حاوی لینک می تواند به صورت محتوای غیر متنی نیز باشد، به طور مثال می توان یک تصویر را با استفاده از تگ img در این قسمت درج کرد، به مثال زیر توجه کنید.

نکته: در برخی مرورگرها تصاویر لینک شده با یک خط در حاشیه مشخص می شوند، برای محو این خط حاشیه ای باید از خاصیت border با مقادیر ۰ در HTML یا در حالت بهتر و استاندارد تر، در CSS استفاده کنید.

بیشتر بخوانید :
آموزش ویدیویی ایجاد دامنه مجازی در لوکال هاست (نرم افزار XAMPP)

در پایان این آموزش، شاید این پرسش به ذهنتان رسیده باشد که چگونه است بیشتر لینک های وب با رنگ ها و حالت های مختلف هستند، به طور مثال فونت و اندازه لینک ها متفاوت است یا با بردن ماوس روی لینک، رنگ آنها تغییر می کند و…، برای یافتن پاسخ این سوالات باید کمی صبر کنید توی جلسات آینده حتما اینارا مورد برسی قرار میدیم، در گام بعدی یعنی فراگیری CSS، خواهیم دید که می توان لینک های وب را با استایل CSS فرم داد و به اصطلاح سفارشی نمود.

منتظر نظرات و پیشنهادات با ارزش شما هستیم امید وارم که توی زندگی موفق و پیروز باشید

راستی! برای دریافت مطالب جدید در کانال تلگرام یا پیج اینستاگرام یا پیج یوتیوب پاسخ وردپرس عضو شوید.

یک برنامه نویس آزاد که علاقه زیادی به اشتراک گذاری اطلاعات خود با دیگران داردم. همیشه به وردپرس فکر می کنم و عاشق وردپرس هستم. من یک web developer هستم و هدف من آسان کردن ورود سایر دوستان به این شغل جذاب هست. زبان برنامه نویسی محبوب من PHP هست.

لینک کپی شد!

نظر شما در این‌باره چیست؟

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