استایل بندی لینک جلسه هفتم

استایل بندی لینک جلسه هفتم

در css برای قالب بندی لینک ها از هر مشخصه ای میتونید استفاده کنید مثلا background , color , font-family و خیلی از مشخصه دیگه.ولی به صورت اختصاصی برای لینک ها ۴ انتخابگر داریم که به قرار زیر هستند:

چهار حالت لینک عبارتند از:

  • a:link (لینک) – یک لینک طبیعی مشاهده نشده است
  • a:visited (بازدید شده) – لینکی که کاربر بازدید کرده است
  • a:hover (شناور) – یک لینک زمانی که کاربر ماوس را روی آن قرار دهد
  • a:active (فعال) – یک لینک لحظه ای که کلیک شود

استایل بندی لینک جلسه هفتم استایل بندی لینک جلسه هفتم استایل بندی لینک جلسه هفتم LINK

هنگامی که استایل لینک را برای چندین حالت لینک تنظیم می کنیم ، چند قانون دستوری وجود دارد :

  • a:hover ، باید پس از a:link و a:visited بیاید
  • a:active ، باید پس از a:hover بیاید

خط زیر لینک ها

در حالت پیش فرض لینک ها زیرخط دار هستند و شما میتونید با خاصیت text-decoration این خط رو حذف کنید . این خاصیت شامل مقادیر زیر میشه :

none : با این مقدار خط زیر لینک حذف میشه .

underline : با این مقدار زیر لینک خط نمایان میشه .

overline : با این مقدار یک خط بالای لینک نمایان میشه .

line-through : یک خط رو لینک دقیقا روی عبارت نمایان میشه .

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

خاصیت text-decorationعمدتا برای حذف “زیرخط” از لینک استفاده می شود

استایل بندی لینک جلسه هفتم:تعیین رنگ زمینه برای لینک

خاصیت background-color ، رنگ پس زمینه برای لینک را مشخص می کند :

خوب برای اینکه بتونم رنگ زمینه یک لینک رو تعیین کنیم از مشخصه ای که قبلا  هم باهاش آشنا شده اید یعنی background-color استفاده میکنیم.از این کار میتونید برای ساخت منو ها استفاده کنید و بدون استفاده از عناصر گرافیکی و تنها با استفاده از رنگ بندی css منوهای رنگی و در عین حال سبک و جذاب ایجاد کنید که آموزش این کار رو در دروس بعدی با هم مرور خواهیم کرد:

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

 

آموزش CSS آموزش طراحی وب

دیدگاه خود را بیان کنید