如何在同一页面上添加多个链接样式？答案

【问题标题】：How to add multiple link styles on the same page?如何在同一页面上添加多个链接样式？
【发布时间】：2012-10-03 11:12:04
【问题描述】：

我在一个页面上有两个超链接。我对“link1”（白色文本/红色翻转）上的 css 很满意，但是我想为“link2”设置不同的样式。

我为此部分创建了一个单独的 css，并设法将其着色为绿色，但我无法摆脱红色的翻转效果？

有谁知道如何覆盖“link2”上的红色翻转效果？

谢谢！

【问题讨论】：

【解决方案1】：

为两个不同的链接使用两个不同的类

【讨论】：

【解决方案2】：

为悬停属性添加 CSS 规则。

这里有一个小提琴给你看：http://jsfiddle.net/6cLJ8/

导致您的问题的代码（在您的 CSS 中）是：

a:hover {
    background-color: #f00;
}

覆盖它：

.readmoretext a:hover {
    background: none;
}

【讨论】：

【解决方案3】：

您的样式表存在一些问题：

首先，您使用的是.readmoretext A。锚标记的正确 CSS 选择器是小写的“a”，因此需要更正为 .readmoretext a。

完成后，将background-color: transparent; 添加到悬停规则以移除红色背景。

最后，悬停规则中有两个 color 属性。样式表级联，正如其名称所示。由于只会应用最后一个 color 规则，因此第一个已过时。

【讨论】：