css~选择器 CSS :active 选择器

css~选择器

CSS 选择器是 CSS 中最重要的部分，它用于指定 HTML 元素，以便应用样式。CSS 选择器可以根据元素的 ID、类、属性、伪类或元素名称来选择 HTML 元素。

CSS 选择器可以分为三大类：基本选择器、属性选择器和伪类选择器。

1. 基本选择器： 
    * 标记名选择器（Element Selector） 
    * 类选择器（Class Selector） 
    * ID 选择器（ID Selector） 
    * 相邻兄弟选择器（Adjacent Sibling Selector） 
    * 子代选择器（Child Selector） 
    * 后代选择器（Descendant Selector) 
2. 属性选择器: 
    * [attribute] 通配符匹配所有带有该特定的 attribute 的元素。 
    * [attribute=value] 精准匹配所有带有该特定 attribute 和 value 的元素。 
3. 伪类选择器:  										  	  	  	  	  	  	  	  	  	  	  

    * :link 表示所有还未被访问过的链接。 
    * :visited 表示所有已被访问过的链接。 
    * :hover 表示当用户将鼠标光标位于其上时的效果。 
    * :active 表示当用户正在单击该元素时的效果。     

CSS :active 选择器

CSS :active 选择器

完整CSS选择器参考手册

定义和用法

:active向活动的链接添加特殊的样式，当你点击一个链接时它变成活动链接。

:active选择器匹配激活元素，不限于用户可以与之交互的元素。

:active是一个伪类选择器，它适用于被激活的元素。

最常见的示例是单击HTML文档中的超链接：当按住鼠标按钮时，链接处于活动状态。

提示: :link 选择器设置了未访问过的页面链接样式, :visited 选择器设置访问过的页面链接的样式, :hover 选择器当有鼠标悬停在其上的链接样式。

注意: 为了产生预期的效果，在CSS定义中，:active必须位于:hover之后！！

---

实例

实例 1

选择激活的链接样式：

a:active
{
  background-color:yellow;
}

实例 2

激活的、已访问的、未访问的或者当有鼠标悬停在其上的链接：

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

实例 3

不同样式的链接样式：

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

---

浏览器支持

表格中的数字表示支持该属性的第一个浏览器版本号。

选择器
:active	4.0	7.0	2.0	3.1	9.6

注意：对所有元素IE8以及新版本浏览器均支持:active选择器。:active选择器对于IE7只支持链接。

---

相关文章

CSS 教程: CSS Links

CSS tutorial: CSS 伪类

---

完整CSS选择器参考手册