实例代码:
<!doctype html>
<head>
<meta charset="utf-8">
<style type="text/css">
a:link{color:red;} /* 未被访问的链接*/
a:visited{color:blue;} /* 已被访问的链接*/
a:hover{color:black;} /*当鼠标指针移动到链接上*/
a:active{color:green;} /*正在被点击的链接*/
</style>
</head>
<html>
<body>
<h1>这是一个链接样式实例</h1>
<a href="https:www.dwoke.com">这是一个你行网的链接</a>
<p>注释:为了使定义生效,a:hove 必须位于a:link 和 a:visited 之后 !!</p>
<p>注释:为了使定义生效,a:active 必须位于a:hover 之后!!</p>
</body>
</html>
运行效果:
a:link :定义未被访问的链接 ,顺序为1。
a:visited: 定义已被访问的链接, 顺序为2。
a:hover: 定义当鼠标指针移动到链接上时, 顺序为3 。
a:active: 定义正在被 点击的链接, 顺序为4。
注意:上面的鼠标动作一般要安顺执行。
评论