CSS :active 选择器
下面有更多实例。
定义和用法
:active 选择器用于选择活动链接。
当您在一个链接上点击时，它就会成为活动的（激活的）。
提示: :active 可用于所有元素，而不仅仅是链接。
提示：请使用 :link 选择器对指向未被访问页面的链接设置样式，:visited 用于设置指向已访问页面的链接的样式，:hover 选择器用于设置鼠标指针浮动到链接上时的样式。
注释: :active 必须位于 CSS 定义中 :hover （如果存在）之后才能生效！
| 版本: | CSS1 |
|---|
浏览器支持
表格中的数字注明了完全支持该属性的首个浏览器版本。
| 选择器 | |||||
|---|---|---|---|---|---|
| :active | 4.0 | 7.0 | 2.0 | 3.1 | 9.6 |
语法
:active {
css declarations;
}
css declarations;
}
更多实例
实例
单击 <p>, <h1> 和 <a> 元素时，选择并设置其样式:
p:active, h1:active, a:active {
background-color: yellow;
}
亲自试一试 »
background-color: yellow;
}
实例
选择未访问、已访问、悬浮和活动链接，并设置它们的样式:
/* 未访问的链接 */
a:link {
color: green;
}
/* 访问过的链接 */
a:visited {
color: green;
}
/* 鼠标悬停的链接 */
a:hover {
color: red;
}
/* 选中的链接 */
a:active {
color: yellow;
}
亲自试一试 »
a:link {
color: green;
}
/* 访问过的链接 */
a:visited {
color: green;
}
/* 鼠标悬停的链接 */
a:hover {
color: red;
}
/* 选中的链接 */
a:active {
color: yellow;
}
实例
为链接设置不同的样式:
a.ex1:hover, a.ex1:active {
color: red;
}
a.ex2:hover, a.ex2:active {
font-size: 150%;
}
亲自试一试 »
color: red;
}
a.ex2:hover, a.ex2:active {
font-size: 150%;
}
相关页面
CSS 教程: CSS 链接
CSS 教程: CSS 伪类
