css链接颜色样式最佳实践

Question

有很多css样本用于链接的样式颜色.

html5boilerplate.com为链接提供了这样的css代码:

a { color: #00e; }
a:visited { color: #551a8b; }
a:hover { color: #06e; }?

对大多数情况来说它足够好吗？

或者也许更好的css代码存在链接的样式颜色？

Answer 1

在绝大多数情况下,这绝对是足够的.

请记住,链接样式的正确顺序是:

a:link           { color: #c00 }  /* unvisited links       */
a:visited        { color: #0c0 }  /* visited links         */
a:hover, a:focus { color: #00c }  /* user hovers, or focus */
a:active         { color: #ccc }  /* active links          */

在outline看起来"丑"为你,但是这是一个非常重要的辅助功能.如果你删除它 - 请注意提供一种替代方法来正确区分当前元素(更大/更大胆的字体,高对比度背景等)

Answer 2

我总是重置浏览器之间可能不同的设置.

我还想通过添加图像(类似于维基百科中的图像)以不同方式标记指向外部网站的链接.

a,
a:link,
a:active,
a:visited,
a:hover {
    color:           #d30;
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
}

/* Links to external websites */
a.external:before {
    content:         url(./pics/external.png);
}