CSS的伪类选择器在a标签上的应用

一、:link 未访问链接

:link可以控制a链接未访问链接的状态。

将链接未访问前设为红色，点击访问链接后红色消失。

a:link{
	color: red;
	text-decoration: none;
}

 

二、:visited 已访问链接

:visited可以控制a链接已访问链接的状态。

 使用:visited 已访问链接时，不建议改变其背景颜色和字体颜色以外的样式。

出于隐私原因，浏览器严格限制您可以让此伪类应用的样式，以及使用它们的方式。

a:visited {
  background-color: yellow;
  border-color: hotpink;
  color: hotpink;
}

三、:active链接激活

 :active可以控制a链接已点击链接的状态。

它让页面能在浏览器监测到激活时给出反馈，在用户按下按键和松开按键之间做出反馈。

在有多键鼠标的系统中，CSS 3 规定 :active伪类必须只匹配主按键；对于右手操作鼠标来说，就是左键。

a:active{
	color: red;
}	

                      

 四、:hover划过链接

 :hover可以控制鼠标划过a链接的状态。

 会在光标（鼠标指针）悬停在元素上时提供关联的样式。

:hover伪类可以任何伪元素上使用。可用于导航栏的制作：

ul > li{
	width: 100px;height: 30px;background: black;text-align: center;line-height: 30px;color: white;float: left;
	position: relative;
}
ul > li:hover{
	color: black;background: orange;
}

 

为了确保生效，:hover需要放在:link和:visited之后，但是在:active之前，需按照:link－:visited－:hover－:active的循顺序声明。