link 的四種狀態

Q: a 跟 a:link的權重誰比較高？
A: a:link比較高
a /* specificity = 1 */
a:link /* specificity = 1,1 */

Q: a:link a:hover a:active a:visited 誰的權重比較高？
A: 都一樣高
a:link /* specificity = 1,1 */
a:hover /* specificity = 1,1 */
a:active /* specificity = 1,1 */
a:visited /* specificity = 1,1 */

Q: a:link 與 a:visited 有何不同？
A: a:link 指的是 unvisited link， a:visited 指的是 visited link，注意皆必須有 href 的屬性(a name="foobar" 不會apply這些屬性)。
比較詳細的定義如下

:link
Refers to any anchor that is a hyperlink (i.e., has an href attribute) and points to an address that has not been visited. Note that some browsers may incorrectly interpret :link to refer to any hyperlink, visited or unvisited.
:visited
Refers to any anchor that is a hyperlink to an already visited address.

Q: a{color:red} 與 a:link{color:red} 有何不同？
A: a{color:red}不僅 apply 到 <a href="foobar"> ，也會apply到 < a name="section4"> ，而 a:link{color:red} 只會apply到前者。

Q: 我有聽過 :link :visited :hover :active(LoVe HAte) 的順序，有什麼意義嗎？
A: 主要是因為這些 pseudo class有相同的權重，所以這個順序是依照一般事件發生的順序排列的，一般是一個 link，然後會 hover 過去，最後才是點擊發生的 active。假設今天順序寫成 a:hover{color:red} a:link, a:visited{color:blue}，當滑鼠移過去 link 的時候，這時候連結仍然會是藍色的，因為 a:hover 的屬性會被 a:link 或 a:visited 蓋過去。

另外，由於:link與:visited不會同時出現(要不是visited就是unvisited)，這個順序也可以換成:visited :link :hover :active，不過就沒有口訣了。

Reference: Eric Meyer: Link Specificity