1.伪类选择器分类
伪类选择器描述的当前标签所经历的状态共分为四种,其分别是:
1)link:鼠标没有访问过的状态
2)hover:鼠标悬停在标签的状态
3)active:鼠标激活状态,鼠标点击了,但是没有松开的一种状态
4)visited:鼠标已经访问过的状态(鼠标点击了,并且松开了)
2.伪类选择器的书写格式
伪类选择器的基本书写格式为:
选择器:状态{
css样式属性:属性值;
}
3.代码实现
代码实现:
下面将对以上四种状态的代码(部分)实现做以说明
<style>
/*link状态*/
a:link{
font-size:26px;
color:#F00;
/*文本修饰*/
text-decoration:none;
}
/**visited状态**/
a:visited{
font-size:26px;
color:#ccc;
}
/*hover状态*/
a:hover{
font-size:30px;
color:#00F;
/*文本修饰:添加下划线*/
text-decoration:underline;
}
/*active状态*/
a:active{
font-size:36px;
color:#0F0;
text-decoration:none;
}
</style>
需要注意的是:
伪类选择器的这四种状态必须按照特定的顺序 才能有循环的效果。
- 在CSS定义中,a:hover必须被置于a:link和a:visited之后,才是有效的。
- 在CSS定义中,a:active必须被置于a:hover之后,才是有效的。
- 伪类名称对大小写不敏感
以上就是对伪类选择器的一些简单说明。