2013年9月17日 星期二

[轉貼] 定義 a:link / a:visited / a:hover / a:active 的順序

出處:http://www.dotblogs.com.tw/joysdw12/archive/2011/01/07/20651.aspx


在網站超連結效果使用上常常用到 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: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>


參考:http://www.w3schools.com/css/default.asp

沒有留言:

張貼留言