老外总结了一个便于记忆的“爱恨原则”（LoVe/HAte），即四种伪类的首字母:LVHA。
定义A链接样式的正确的顺序：a:link、a:visited、a:hover、a:active .
为什么我们不能改变定义的顺序? 做下测试就可以了.
假设我们想实现下面的样式:
|
状态 |
样式 |
颜色 |
|
已访问 |
a:visited |
红 |
|
未访问 |
a:link |
蓝 |
|
选定 |
a:active |
绿 |
|
鼠标移入 |
a:hover |
黄 |
第一种方式:
鼠标移入时,并没有变黄.而是当这个链接已经被访问过后,鼠标移入才变黄
<style type="text/css">
a:visited{color:red;}
a:hover{ color:yellow;}
a:link{ color:blue;}
a:active{ color:green;}
</style>
这是因为,一个鼠标经过的未访问的链接同时拥有a:link,a:hover两种属性,在上述的CSS样式中,a:link离他最近,先满足a:link,而放弃a:hover的重复定义.
而使用LVHA顺序声明后,它首先检查a:hover的符合标准,先变色.
所以说,为了符合浏览器解释CSS遵循的"就近原则".我们在定义CSS中,宜将最一般的条件放在最上面,并依次向下,最下面放最特殊的.
在W3C规范中,也规定了链接的声明顺序:
1.在 CSS 定义中，a:hover 必须被置于 a:link 和 a:visited 之后，才是有效的。
2.在 CSS 定义中，a:active 必须被置于 a:hover 之后，才是有效的。