：hover可以工作，但是其余的链接状态不起作用（例如：: link＆：visited）

Question

出于我未知的原因，对于其中包含“ TWO”的div：

:hover状态正常 :link，:visited不起作用

我找不到原因？

.menu:link {
  color: teal;
}

.menu:visited {
  color: red;
}

.menu:hover {
  color: yellow;
}

<div>
  <a>
    <div class="menu">ONE</div>
  </a>
  <a href="smth.html">
    <div class="menu">TWO</div>
  </a>
</div>

Answer 1

:visited和:link选择器与<a>标签一起使用。

a:visited > .menu{
  color: red;
}
a:link > .menu {
  color: teal;
}
a:hover > .menu {
  color: yellow;
}

<div>
  <a>
    <span class="menu">ONE</span>
  </a>
  <a href="https://stackoverflow.com" target="_blank">
    <span class="menu">TWO</span>
  </a>
</div>

顺便说一句，我认为在div内使用a并不是一个好主意