html - 悬停在元素上时更改文本和链接的颜色

Question

我有一个非常简单的元素，其中包含一些文本或链接。

当我将鼠标悬停在元素上时，我想同时更改文本颜色和链接颜色。我无法让它工作，我认为这是因为你不能选择 2 个伪类。我怎样才能让这样的东西发挥作用？

CSS:

.test, .test a:link, .test a:visited {
  color: white;
  text-decoration: none;
}

.test:hover, .test:hover .test a:link, .test:hover .test a:visited {
   color: yellow;
   text-decoration: none;
}

html:

<div class="test">
  testtext<br>
  <a href="#">testlink</a>
</div>

Answer 1

只需正确链接到您的路径:

.test,
.test a:link,
.test a:visited {
  color: white;
  text-decoration: none;
}
.test:hover,
.test:hover a:link,
.test:hover a:visited {
  color: yellow;
  text-decoration: none;
}

jsfiddle