CSS中的鏈接樣式

Question

為什么鏈接的以下樣式無效？

<html>
<head>
<style type="text/css">
    a:link {color:#123456;}    /* unvisited link */
</style>
</head>

<body>
    <a href="http://www.google.com">Visit Google</a>
</body>
</html>

謝謝！

Answer 1

對於某些一般的最佳實踐，鏈接樣式層次結構的工作方式如下：

a:link {
color: #ff0000;
}
a:visited {
color: #ff0000;
}
a:hover {
color: #cccccc;
}
a:focus {
color: #cccccc;
}
a:active {
color: #cccccc;
}

最好始終應用所有這些，無論您是按上面的方式單獨執行還是按以下方式進行操作：

a:link, a:visited {
color: #ff0000;
}
a:hover, a:focus, a:active {
color: #cccccc;
}

但是無論如何，順序非常重要，如果不遵循該順序，則可以覆蓋所有內容。

Answer 2

這是因為鏈接已被訪問。

嘗試

a {color: blue;} /* unvisited link */
a:visited {color: orange;} /* visited link*/

如果刪除最后一個聲明，則無論:visited鏈接將變為藍色。

Answer 3

而且，您將來不應該依賴它來工作：

http://blog.mozilla.com/security/2010/03/31/plugging-the-css-history-leak/

CSS中的鏈接樣式

問題描述

3 個解決方案

解決方案1
3 2010-04-10 04:57:15

解決方案2
2 已采納 2010-04-10 03:42:59

解決方案3
0 2010-04-10 03:53:42

CSS中的鏈接樣式

問題描述

3 個解決方案

解決方案1 3 2010-04-10 04:57:15

解決方案2 2 已采納 2010-04-10 03:42:59

解決方案3 0 2010-04-10 03:53:42

解決方案1
3 2010-04-10 04:57:15

解決方案2
2 已采納 2010-04-10 03:42:59

解決方案3
0 2010-04-10 03:53:42