css - 为什么链接样式适用于所有元素，即使它应该只适用于一个元素

Question

为什么此页面上的链接（以及所有其他但最好演示的链接）在所有页面中共享链接样式。要演示这个点击投资组合然后返回，你会看到链接文本变成白色，即使这应该只用于页面底部的“消息”元素（带圆角的蓝色）？

这是我的 CSS

.message {
background-color:#54a0d9;
border:1px solid #54a0d9;
color:#fff;
}

.message h2 {
font-size:22px;
color:#fff;
}

.message a:link, a:visited, a:hover, a:active {
color:#fff; }

并且 HTML 是元素内的普通链接（它不是 message 元素的子元素。

当然这应该只适用于 Message 元素？

我已经对造成这种情况的原因进行了一些研究，但到目前为止还没有……

Answer 1

用逗号分隔选择器意味着完全分开考虑它们。所以在这里：

.message a:link, a:visited

意味着将此样式应用于a:link具有“消息”类的元素内部的 s 以及a:visiteds。请注意，后者不必在类 message 的元素内。只需.message在每个逗号分隔的术语前面放置即可修复它。