在網站超連結效果使用上常常用到 a:link / a:visited / a:hover / a:active 這幾個css屬性
但是在使用上必須注意到的是這些屬性是有順序的
使用上的順序如下:
/* 未連結 */
a:link
{
color: #000000;
}
/* 已連結過 */
a:visited
{
color: #FF0000;
}
/* 滑鼠移至連結 */
a:hover
{
color: #00FF00;
}
/* 選擇的連結 */
a:active
{
color: #0000FF;
}
a:link
{
color: #000000;
}
/* 已連結過 */
a:visited
{
color: #FF0000;
}
/* 滑鼠移至連結 */
a:hover
{
color: #00FF00;
}
/* 選擇的連結 */
a:active
{
color: #0000FF;
}
a:hover 需放置在 a:link 跟 a:visited 之後,則 a:active 放置在 a:hover 之後
<style type="text/css">
<!--
a { text-decoration: none } //宣告HTML連結消除底線
a:link {color:#ccccff} //宣告連結顏色
a:visited {color:#ccccff} //訪問過連結顏色
a:hover {color:#ffcccc} //當滑鼠移到連結時連結顏色
a:active {color:#ffcccc} //執行中連結顏色
-->
</style>
沒有留言:
張貼留言