CSS 伪类

CSS 伪类(Pseudo-classes)

CSS伪类是用来添加一些选择器的特殊效果。

语法

伪类的语法：

CSS类也可以使用伪类：

anchor伪类

在支持 CSS 的浏览器中，链接的不同状态都可以以不同的方式显示

      
  
这是一个链接
 
注意： a:hover 必须在 a:link 和 a:visited 之后，需要严格按顺序才能看到效果。
 
注意： a:active 必须在 a:hover 之后。
  

注意：在CSS定义中，a:hover 必须被置于 a:link 和 a:visited 之后，才是有效的。

注意：在 CSS 定义中，a:active 必须被置于 a:hover 之后，才是有效的。

注意：伪类的名称不区分大小写。

伪类和CSS类

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

如果在上面的例子的链接已被访问，它会显示为红色。

CSS - :first - child伪类

您可以使用 :first-child 伪类来选择元素的第一个子元素

注意：在IE8的之前版本必须声明 ，这样 :first-child 才能生效。

匹配第一个

元素

在下面的例子中，选择器匹配作为任何元素的第一个子元素的

元素：

      
  
This is some text.
 
This is some text.
 
注意:对于 :first-child 工作于 IE8以及更早版本的浏览器, DOCTYPE必须已经声明.
  

匹配所有

元素中的第一个 元素

      
  
I am a strong man. I am a strong man.
 
I am a strong man. I am a strong man.
 
注意: 当 :first-child 作用于 IE8以及更早版本的浏览器, DOCTYPE必须已经定义.
  

      
  
I am a strong man. I am a strong man.
 
I am a strong man. I am a strong man.
 
注意: 当:first-child 作用于 IE8及更早版本的浏览器, DOCTYPE 必须已经定义.
  

      
  
Some text A quote in a paragraph Some text.
 
在这个例子中,:lang定义了q元素的值为lang =“no”
 
注意: 仅当 !DOCTYPE已经声明时 IE8支持 :lang.
  

      
  
将鼠标移至链接上改变样式.
 
This link changes color
 
This link changes font-size
 
This link changes background-color
 
This link changes font-family
 
This link changes text-decoration
  

      
  
 用户名: 
 密　码: 
  
 
注意:仅当 !DOCTYPE已经声明时 IE8支持 :focus.