将链接颜色与 a:link 分开的简单方法答案

【问题标题】：Easy way to style link colour separate from a:link将链接颜色与 a:link 分开的简单方法
【发布时间】：2013-09-05 11:09:45
【问题描述】：

我目前正在使用：

a:link {
    color: #FF0000;
    text-decoration: underline;
}

但在我网站的某个页面上，我希望我的链接能够以单独的颜色显示。

通过 CSS 实现此目的的最佳方法是什么？

我不想做：

<font color="#00FF00">...</font>

据我所知，这是不推荐使用的代码

【问题讨论】：

【解决方案1】：

为您想要影响的每个链接添加一个类：

HTML： <a href="#" class="alternate">Link</a>

然后将此 CSS 或类似内容添加到您的样式表中：

CSS： a.alternate {color:#00FF00;} //or whatever

【讨论】：

【解决方案2】：

对link 应用不同的class 属性。例如：

HTML

<a href="#" class="red">link1</a>
<a href="#" class="black">link2</a>

CSS

a:link {
    text-decoration: underline;
}
.red{
    color: #FF0000;
}
.black{
    color: #000000;
}

看到这个Fiddle

【讨论】：