CSS中a:active的作用以及使用詳解

來源:互聯網
上載者:User
CSS :active 選取器

定義和用法

  :active 選取器用於選擇活動連結。

  當您在一個連結上點擊時,它就會成為活動的(啟用的)。

  提示:請使用 :link 選取器對指向未被訪問頁面的連結設定樣式,:visited 用於設定指向已訪問頁面的連結的樣式,:hover 選取器用於設定滑鼠指標浮動到連結上時的樣式。

例子 1 選擇未訪問、已訪問、懸浮和活動連結,並設定它們的樣式:

a:link{color:blue;}a:visited{color:blue;}a:hover{color:red;}a:active{color:yellow;}

例子 2 為連結設定不同的樣式:

a.ex1:hover,a.ex1:active {color:red;}a.ex2:hover,a.ex2:active {font-size:150%;}

定義連結在滑鼠被啟用(點下去)時候的樣式。連結偽類共有四個:
a:link 連結正常樣式a:visited 連結訪問過的樣式a:hover 連結高亮(滑鼠放到上面)的樣式a:active 連結啟用時的樣式

樣本:

<!DOCTYPE html><html><head><style>a:active{background-color:yellow;}</style></head><body><a href="http://www.w3school.com.cn">W3Sschool</a><a href="http://www.google.com">Google</a><a href="http://www.wikipedia.org">Wikipedia</a><p><b>注釋:</b>:active 選取器為活動的連結設定樣式。</p></body></html>

結果為:W3Sschool Google Wikipedia
注釋::active 選取器為活動的連結設定樣式。
定義連結在滑鼠被啟用(點下去)時候的樣式。連結偽類共有四個:
a:link 連結正常樣式a:visited 連結訪問過的樣式a:hover 連結高亮(滑鼠放到上面)的樣式a:active 連結啟用時的樣式

相關文章

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.