CSS的选择器有很多种,有一种选择器,与其他选择器完全不同,我们来讲一讲这个选择器——伪类选择器
伪类选择器
伪类选择器:用来描述一个元素的特殊状态!比如第一个元素、某个元素的子元素、鼠标点击的元素
我们伪类选择器有几种,我们来看看第一种
静态伪类: 只能用于超链接的样式
:link
超链接点击之前:visited
链接被访问过之后
以上两种样式,只能用于超链接
实际用法还得实际分析,我们来看看这一张图:
这里我写了两个超链接,看我箭头指的文章,你会发现这两个超链接颜色是不一样的
为什么会不一样呢?
因为第一个链接,是我访问过的网站链接
而第二个链接,我的浏览器没有访问过,系统会默认给访问过与没访问过的超链接显示不同的颜色
我们访问一下试试,看看他会不会变色
访问过后,第二个超链接的颜色也变成了第一个一样了
那么我们想让没访问过的链接显示其他颜色呢?
这时候就需要我们的伪类选择器上场了,我们在style标签里面用css伪类选择一下
我们使用link来选择没有访问过的超链接
<style>
a:link{color: aqua;}
</style>
注意,我们的伪类选择器是使用“:”来连接
我们在添加一个超链接,也是没有访问过的网址
我们看看效果
这里,我们通过伪类选择器的link对没有访问过的网址进行颜色改变
而访问过的链接颜色没有变化
当我们访问之后,他也就不会被link选中了,所以访问过后,是这样的
到这,有人就问了,访问之前可以被选择,那我想要访问后的链接也变色可不可以呢?
当然可以,事物都有对立一面,编程也一样,可以选择访问之前的超链接,那就肯定可以选择访问之后的超链接
我们写个访问之后的选择,让它变成其他颜色
<style>
a:link{color: aqua;}
a:visited{color: chartreuse;}
</style>
下面那个a:visited就是另一个选择属性了,他会选择被访问过的超链接
我们看看被访问过的超链接有没有变色
最后,再补充一点,看看这张图!
我这里使用一个字体属性,将:visited选择中的字体变大,可是字体并没有改变,这是为什么呢???
因为为了