چاپ
دسته: CSS
بازدید: 3561
ستاره غیر فعالستاره غیر فعالستاره غیر فعالستاره غیر فعالستاره غیر فعال
 

سبک دهی به لینک ها

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

در آن قرار دارند،سبک های متفاوتی بپذیرند.

لینک ها دارای چهار حالت هستند:

. a:link- حالت معمولی، در حالتی که هنوز توسط کاربر بازدید نشده

. a:hover- حالتی که موس کاربر روی لینک قرار گرفته، ولی هنوز روی آن کلیک نشده

. a:visited- حالتی که لینک توسط کاربر بازید شده

.a:active – حالتی که لحظاتی است که بر روی لینک کلیک شده

به طور هثال:

 

/* unvisited link *?/

a:link {

      color:#ff0000;

}

/*visited link */

a:visited {

      color:#00ff00;

}

/* mouse over link */

a:hover {

       color:#ff00ff;

}

/* selected link */

a:active {

      color:#0000ff;

}

 

سبک های مشترک لینک

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

به لینک ها سبک دهی کنیم:

خاصیت text-decoration اکثرا برای حذف خط زیر لینک (underline)به کار می رود.به کار می رود.به طور

مثال:

 

a:link {

     text-decoration: none;

}

a:visited {

    text-decoration: none;

}

a:hover {

   text-decoration: underline;

}

a:active {   

  text-decoration: underline;                                                                                                                

                                                                                                                                                  {

 

 

خاصیت رنگ پس زمینه (background-color)

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

 

a:link {

     background-color:#B2FF99;

}

a:visited {

     background-color:#FFFF85;

}

a:hover {

    background-color:#FF704D;        

  

}

a:active {

     background-color:#FF704D;

}