有几天没有写博客了，考试实在烦人啊！

考试之前我就想困惑这个css中超链接样式设计的问题，一致没有搞明白。无论是从颜色还是下划线都不能达到自己想要的效果。也不知道每一项表示的是超链接什么时候的样式。

今天突然看到一篇博客（http://jeoff.blog.51cto.com/186264/43116）在他的博客中提到了顺序问题。通过实验和之前的摸索学习，我也发现了和顺序有关系，但是具体是什么样的一个关系还是不太清楚。

今天终于有些明白了，下面和大家一起分享一下：

在超链接样式设计中共设计到了a:link、a:visited、a:hover 、a:active 这四种不同条件下的样式。

我最终确定的顺序是：

a:link

    {  /*未被使用过的超链接的样式*/

         text-decoration: none;

         color :#A4BFDD; 

    }

a:visited

    {  /*超链接使用过后的样式*/

        text-decoration : underline;

        color :#A0A0A0;

    }

a:hover                            

    {  /*鼠标滑过超链接的样式*/      

        text-decoration : underline;

         color :#4C72DF;

     }

a:active

    {  /*超链接获得焦点时的样式*/

         text-decoration: underline;

         color:#80F1EB;

                    }

为什么要确定成这样的样式呢？

那就要从css判断顺序和超链接本身特点入手了。

Css中是按照从上到下的顺序进行的。如果标记符合后面的条件就会将显示重新定义。（是以个普遍规律所有的显示都遵循）。

下面说的就是超链接的自身特点了。

我们来分析一下中四种情况：a:link、a:visited、a:hover 、a:active。我们把这四种情况分为两组，1、基础条件（link、visited）   2、特殊条件（hover、active）。

超链接不是未用的就是已用的。所以超链接必然符合基础条件中的一个；而特殊格式，二者可能都不符合也可能都符合。如何确定这两组之间的关系呢？

 

结合css的判断顺序对这两组的关系进行分析。若先判断基础条件再判断特殊条件的话，如果超链接符合了link或visited ，又符合了hover和/或active。那么特殊条件的格式就会把基础条件的格式。这样的效果是我们想要看到的。

那么相反，如果把基础条件判断放在后面（所有的超链接肯定会符合其中的一种条件），那么超链接就永远不会出现hover和active的样式了。也是我们不愿意看到的结果。

 

好了现在整体的顺序我们已经定出来了，下面来确定各组内部的顺序。

在基础条件组中link和visited先判断谁都没有关系，因为他们二者有且只有一种情况被符合。

在特殊条件组中hover和active这两种情况，之间还存在着一些特殊的联系。在实际情况下，超链接获得焦点后，再有鼠标放上去就不会出现hover的样式了，也就是active把hover的样式修改掉。所以说只能是判断hover再判断active。

好了，我们已经把超链接的这个样式设置完成了！