伪类

CSS权威指南定义:a(锚)元素分为两种类型,已访问的和未访问的。这些类型称为伪类。

伪类一开始单单只是用来表示一些元素的动态状态,典型的就是链接的各个状态。随后CSS2标准扩展了其概念范围,使其成为了所有逻辑上存在但在文档树中却无须标识的“幽灵”分类。

类与伪类的区别:类不需要用户或者浏览器做什么动作以及状态就可以显示的效果。而伪类是需要用户做出某种动作之后才显示的效果。 伪类中最典型的例子是:对于链接的控制。 对链接的操作状态有四种:link(链接)、visited(已访问的链接)、hover(鼠标停在上方的)、active(激活时的状态)。

伪类例子

a:visited{color:red;}

分隔a和visited的冒号是伪类或伪元素的“名片”。

链接伪类

:link -- 指示作为超链接(即有一个href属性),并且指向一个未访问地址的所有锚。

:visited -- 指示作为已访问地址超链接的所有锚。

1. :link不可省略,因为单纯使用a来匹配,会把那些不包含href属性的a元素也匹配进来。

2. :link和visited是静态的,第一次现实之后,一般不会再改变文档的样式。

动态伪类

:focus -- 指示当前拥有输入焦点的元素

:hover -- 指示鼠标停留在哪个元素上

:active -- 指示被用户输入激活的元素,例如鼠标指针停留在一个超连接上时,如果用户点击鼠标,就会激活这个超链接,:active将会指示这个超链接。

:first-child

静态伪类,用来选择元素的第一个子元素。

p:first-child{font-weight:bold;} --> 将作为某元素第一个子元素的所有p元素设置为粗体。

li:first-child{text-transform:uppercas;} --> 将作为某元素第一个子元素的所有li元素变成大写。

你可能感兴趣的:(伪类)