:active -- CSS :active 偽類，適用于一個元素被激活時的樣式

• 語法: :active
• CSS版本：CSS1
• 引用網址：http://www.dreamdu.com/css/pseudo-class_active/
• 說明：
  • 適用于一個元素被激活時的樣式，例如鼠標在此元素的區域內按下但還沒有釋放時
  • 客戶端（瀏覽器）可以根據用戶與其交互的動作改變其渲染效果，CSS為這種情況提供了三個偽類：hover、active、focus
  • 上述三種偽類不是互斥的，一個元素同時可以適用其中的若干個
  • :active偽類，適用于一個元素被用戶激活時，例如用戶在按下鼠標之后放開鼠標之前的這一段時間內。當用戶放開鼠標后，恢復元素原有的樣式
• active，中文"激活、活躍"的意思

語法

:active a:active a.class:active

示例

a:active { color:yellow; background:blue; font-size:small; } p:active { color:yellow; background:blue; font-size:large; } div:active { color:red; background:lime; font-size:small; }

CSS :active 偽類示例 -- 可以嘗試編輯

• CSS :active 偽類示例

偽類選擇符的順序：L-V-H-A

CSS提供了四種元素設置鏈接的顏色，包括:link、:visited、:hover、:active，它們的聲明是有一定順序的，我們簡稱這種順序為L-V-H-A，即link最先，其次visited，之后hover，最后active，如此聲明才能保證hover與active狀態顯示正確的樣式

示例

統一定義鏈接各種狀態下的樣式

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

CSS :active 偽類示例 -- 可以嘗試編輯

• CSS偽類示例，統一定義鏈接各種狀態下的樣式

一個頁面可以定義多個鏈接樣式

可以在一個頁面定義多種鏈接樣式，例如下面示例定義了灰色與白色兩種樣式的連接

.gray:hover,.gray:focus,.gray:active,.gray:link,.gray:visited { color:#999; } .white:hover,.white:focus,.white:active,.white:link,.white:visited { color:#000; font-weight:bold; }

CSS :active 偽類示例 -- 可以嘗試編輯

• CSS偽類示例，一個頁面定義多個鏈接樣式

IE瀏覽器不支持A元素以外的其它元素的:active偽類

IE6、IE7(Q)、IE8(Q)瀏覽器不支持A元素以外的其它元素的:active偽類，可通過示例一測試

瀏覽器兼容性

CSS E:active 偽類瀏覽器兼容性 選擇符IE6IE7IE8IE9FFCHOPSAE:active

part	part	part	yes	yes	yes	yes	yes

總結

以上是生活随笔為你收集整理的CSS :active 伪类的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。