Question

我的CSS有以下代码用于整个网站的链接：

#mainpanecontent A:link {
    FONT-WEIGHT: bold; COLOR: #6a0a0a; TEXT-DECORATION: none
}

我想使用下面的代码将标题更改为不同颜色的链接但不强制执行。我的代码位于使用“mainpanecontent”的div中：

标头代码

.contact
 {
    font-family: Tahoma, Geneva, sans-serif;
    font-size: 14px;
    font-weight: bold;
padding-left: 50px;
background-position: 25px 14px;
padding-top: 13px;


}

.contact a:link, .contact a:visited
{

color: #1F507F;

}


.contact a:hover
{

color: #1F507F;


}
.contact a:active
{

color: #1F507F;


}

Answer 1

#mainpanecontent A:link的特异性高于您.contact a:something的任何特异性。解决此问题的最佳方法可能是为您的标头提供ID并使用它。如果你不能，并且它只在#maincontent，#maincontent就足够了，即使它不完全合适。（取决于具体情况。）

#mainpanecontent .contact a:link {
    color: #1f507f;
}

此外，只需删除:link，特别是如果您要为所有这些内容指定相同的内容。（那里唯一的考虑因素<a name>，现在还没有使用过。）

Answer 2

CSS有一个优先级系统来处理什么标记:: Give this a read

以下是对代码的简单重写，应该有效：）

列表中较高的内容应覆盖相同类型列表中较低的内容

.contact a:active
{

color: #1F507F;


}
.contact a:hover
{

color: #1F507F;


}

.contact a:link, .contact a:visited
{

color: #1F507F;

}


 .contact
 {
    font-family: Tahoma, Geneva, sans-serif;
    font-size: 14px;
    font-weight: bold;
padding-left: 50px;
background-position: 25px 14px;
padding-top: 13px;


}

Answer 3

CSS规则有时不会被强制执行，因为之前的规则是显式的，在上面列出的规则中它引用了一个ID，它比一个类更明确。

另一个问题当然可能是你的“覆盖”是在另一条规则之前定义的，因此它们会被覆盖。

在第一种情况下，您可以使用!important强制覆盖规则。

e.g。

.contact
{
  font-family: Tahoma, Geneva, sans-serif;
  font-size: 14px;
  font-weight: bold;
  padding-left: 50px;
  background-position: 25px 14px;
  padding-top: 13px;
}

.contact a {
  color: #1F507F !important;
}

注意我删除了其他规则，因为在每种情况下你只是将链接颜色设置为相同的颜色，因此不需要定义伪类:hover，:active等。同样的常数。

CSS不会改变链接颜色。不知道为什么

3 个答案: