从超链接中删除所有样式/格式

我正在用不同颜色的单词创建一个导航菜单(href链接)。我想颜色不改变任何状态(悬停，访问等)。

我知道如何为不同的状态设置颜色，但我想知道的代码只是离开文本颜色(和任何其他样式/格式)，因为它是。

有什么建议吗?

当前回答

就像Chris之前说的，a应该覆盖。例如:

a { color:red; }
a:hover { color:blue; }
.nav a { color:green; }

在这种情况下，.nav a将始终是绿色的，:hover将不适用于它。

如果有其他规则影响它，你可以使用!important，但你不应该。这是一个坏习惯。

.nav a { color:green !important; } /*I'm a bad person and shouldn't use !important */

它总是绿色的，与其他规则无关。

其他回答

就像Chris之前说的，a应该覆盖。例如:

a { color:red; }
a:hover { color:blue; }
.nav a { color:green; }

在这种情况下，.nav a将始终是绿色的，:hover将不适用于它。

如果有其他规则影响它，你可以使用!important，但你不应该。这是一个坏习惯。

.nav a { color:green !important; } /*I'm a bad person and shouldn't use !important */

它总是绿色的，与其他规则无关。

你可以简单地为链接定义一个样式，它将覆盖a:hover, a:visited等:

a {
  color: blue;
  text-decoration: none; /* no underline */
}

如果你想使用父样式的属性，你也可以使用继承值:

body {
  color: blue;
}
a {
  color: inherit; /* blue colors for links too */
  text-decoration: inherit; /* no underline */
}

您可以在样式表中使用a选择器来定义锚点/超链接的所有状态。例如:

a {
    color: blue;
}

将覆盖所有链接样式，并使所有状态的颜色为蓝色。

属性值对:

a {
    all: unset;
}

在我看来似乎更干净，并具有与所有选择器一起工作的优势，例如:

a, button /* &c... */ {
    all: unset;
}

要了解更多关于所有速记的信息，请查看此页面:https://developer.mozilla.org/en-US/docs/Web/CSS/all 正如Emi所说，不要忘记检查兼容性: https://caniuse.com/css-all

如果你设置了a.redLink{color:red;}，那么要保持悬停，添加a.redLink:hover{color:red;}这将确保没有其他悬停状态会改变你的链接的颜色

推荐文章