آموزش گام به گام CSS 2.0 بخش هفده

 

Styling Links:

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

لینک دارای چهار موقعیت بشرح ذیل است:

a:link این زمانی است که لینک مورد نظر هنوز مشاهده نشده است.
a:visited هنگامی است که لینک مورد نظر توسط کاربر بازدید میشود.
a:hover هنگاهیم است که کاربر موس خود را بر روی لینک صفحه قرار میدهد.
a:active وقتی که کاربر بر روی لینک کلیک می کند.

Code
<!DOCTYPE html>

a:link {color:#FF0000;}    /* unvisited link */
a:visited {color:#00FF00;} /* visited link */
a:hover {color:#FF00FF;}   /* mouse over link */
a:active {color:#0000FF;}  /* selected link */
</style>
</head>

This is a link</a></b></p>
Note:</b> a:hover MUST come after a:link and a:visited in the CSS
definition in order to be effective.</p>
Note:</b> a:active MUST come after a:hover in the CSS definition in order
to be effective.</p>
</body>
</html>

 

تذکر:

هنگامی که تنظمیات مربوط به استایل رو برای لینکهای زیادی در صفحه انجام میدهید باید طبق ترتیب قانون زیر عمل کنید:

a:hover همیشه بعد از a:link و a:visited قرار میگیرد.
a:active هم بعد از a:hover قرار میگیرد.

در مثال زیر از خاصیت text-decoration برای حالتهای مختلف لینک استفاده شده است:

Code:
<.!DOCTYPE html>



a:link {text-decoration:none;}    /* unvisited link */
a:visited {text-decoration:none;} /* visited link */
a:hover {text-decoration:underline;}   /* mouse over link */
a:active {text-decoration:underline;}  /* selected link */
<./style>
<./head>

This is a link<./a><./b><./p>
Note:<./b> a:hover MUST come after a:link and a:visited in the CSS
definition in order to be effective.<./p>
Note:<./b> a:active MUST come after a:hover in the CSS definition in order
to be effective.<./p>
<./body>
<./html>