伪类

首页 > CSS基础知识 > 伪类

伪类

伪类是预先定义好的类,用户可以改变其内容,伪类名的前面要用冒号(:)。a 元素的伪类有 link, visited, active, hover ,它们分别代表未访问的链接、已访问的链接、选中的链接以及鼠标移动到链接上时的状态。

a:link { color: green; }     /* 未访问的链接 */
a:visited { color: blue; }   /* 已访问的链接 */
a:hover { color: yellow; }   /* 鼠标移动到链接上时 */
a:active { color: red; }     /* 选中的链接 */

hover 是 CSS2 开始支持的伪类,代表鼠标移动到链接上时的状态,IE4.0 开始支持。

a:hover 必须写在 a:link 和 a:visited 之后。

a:active 必须写在 a:hover 之后。

伪类可以与 CSS 类配合使用。

a.red : visited { color: red; }
<a class="red" href="xxx.html">猴子web入门</a>

其他还有下面这些伪类。first-line 是第一行,first-letter 是第一个字符,first-child 是第一个子元素,lang 是被赋予了某种语言的元素 。

p:first-line { color: red; }    /* 第一行 */
p:first-letter { color: red; }  /* 第一个字符 */
p:first-child { color: red; }   /* 第一个子元素 */
q:lang(jp) { quotes: "~" "~" }  /* 被赋予了某种语言的元素 */