首頁 > web前端 > css教學 > CSS中a:active的作用以及使用詳解

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

黄舟
發布: 2017-07-19 16:53:48
原創
16910 人瀏覽過

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 連結啟動時的樣式

以上是CSS中a:active的作用以及使用詳解的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板