在现有的 CSS 文件中,我们有:
a:link {
text-decoration: none;
color: #0486d9;
}
a:visited {
text-decoration: none;
color: #0486d9;
}
这很好,但我不希望在所有情况下都使用该样式。例如,对于此链接,我希望它始终为白色并带有下划线:
<a id="someId" class="GridviewSort" href="...">Date</a>
我以为这样就可以了:
.GridviewSort a:link {
text-decoration: underline;
color: white;
}
.GridviewSort a:visited {
text-decoration: underline;
color: white;
}
但事实并非如此。保留了原来的风格。我做错了什么?
编辑:
谢谢,stybl。出于某种原因,原来的蓝色仍然占主导地位。但是下划线正在工作!这是正在发生的事情:
编辑 2:
好的,在同一个样式表中更上一层是这样的:
a {
color: #0486d9 !important;
}
这仍然强制链接为蓝色。我不想更改或删除此行,因为它可能会对网站的其他地方产生影响。有没有办法覆盖这个?
最佳答案
.GridviewSort a:visited
目标 <a>
属于 GridviewSort
元素的子标签类(class)。你想要的是目标 <a>
具有该类的标签。
这应该有效:
a.GridviewSort:link {
text-decoration: underline;
color: white;
}
a.GridviewSort:visited {
text-decoration: underline;
color: white;
}
注意:如果您打算为已点击和未点击的链接使用完全相同的样式,您可以像这样缩短它:
a.GridviewSort:link,
a.GridviewSort:visited {
text-decoration: underline;
color: white;
}
关于html - 覆盖 :link by class 的 CSS,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47229415/