CSS 与 a:link 和 a:visited in 2 class/id 冲突

Question

我对 2 类/id 的 a:visited 和 a:link 有疑问。

#title a:link, #title a:visited {
color:black;
}

#PageCounter a:link, #PageCounter a:visited {
color:green;
}

输出： #title 和 #PageCounter 的所有链接都是黑色的。

但我希望 #PageCounter 全部为绿色。

我确实试过用“#title:visted”和“#title:visited”和“#titlevisited”进行测试......不起作用。 =/

（示例）HTML 格式：

<div id="title"><a href="#">Hello World</a></div><br><br>
<font id="PageCounter"><a href="?page=x">1,2,3,4,5,6,7,....</a></font>

Answer 1

锚标记是 ID 为“title”和“PageCounter”的元素的直接后代吗？如果是这样，您可能想要使用子选择器：

#title > a:link, #title > a:visited {
    ...
}
#PageCounter > a:link, #PageCounter > a:visited {
    ...
}

您在问题中显示的选择器将影响由“title”和“PageCounter”标识的元素中的任何锚元素，无论它们嵌套的深度如何。这些选择器中的一个可能会“隐藏”另一个。使用子选择器使其更加明确。