我们在点击超链接的时候，会发现
这四个状态，链接的文本会发生不一样的状态，这样的效果就是用CSS的伪类选择器来实现。
正确的CSS顺序应该是
Why?
因为这四个CSS的优先级是一样的，所有后者会覆盖前者。
从实现的步骤来分析，就应该是这样排列才对。
用户的操作步骤是
1. 还没有点击链接
那么只有 a:link 这一条样式生效，用户看到的是没有点击的样式。
2. 鼠标移上去悬浮在链接上
那么 a: link 和 a: hover 这两条生效，由于 a: hover 在后面，所以样式3覆盖了样式1，显示的是鼠标移上去悬浮在链接上这个样式
3. 鼠标按了下去
那么 a:link 、 a:hover 和 a:active 这三条生效， a:active 覆盖了前两者，显示出来的就是鼠标点击时候的样式。
4. 点击完发生链接之后
那么 a: visited 这一条永久生效，显示出来的就是链接后的样式。
总之，必须是，
a:active 是鼠标点击时；
a:visited是访问过后的情况；
样式还是在这里写，只不过点击得用js添加这个样式到按钮上，css没有对点击提供类似hover的支持；
这种问题可以称作“超链接的响应颜色变化”。实现的方法可以有很多种。举一种常用的方法，在head（头部里)用css样式表进行声明。
<!------代码如下---->
<style (type="text/css")>
a:link{
color:black <!--未点击的超链接显示黑色--->
a:hover{
color:purple<!----当鼠标指向超链接时变成紫色----->
a:visited{
color:red <!----当超链接被访问过后变成红色----->
</style>
如果楼主是老版本的浏览器，可能还需要先声明括号中第一行代码中的，type=“text/css”。
html5的话，就不用带上这句代码了。PS:超链接的响应还有其他2种，一共五种，这里只列出了3种较为常用的。
