访问者的风格同级

Question

我的HTML看起来像这样：

gn_#

我想对访问的链接的所有同级链接应用一种样式。 我尝试过：

<ul>
    <li>
        <a></a>
        <a></a>
        <a></a>...
    </li>
</ul>

什么也没发生。但是

ul>li>a:visited ~ a{
    color: green !important;
}

完全正常。 对具有访问链接的ul>li>a:first-child ~ a{ color: green !important; } 应用样式也对我有用。

Answer 1

试图破解以上内容，该选择器应该可以工作。在这里，我试图选择嵌套在a下的任何li的同级，后来，我忽略了尚未访问的a。这应该可以模拟您想要的效果。

---

相同预览：

---

ul > li > a ~ a:not(:visited) {
  color: red;
}

<ul>
  <li>
    <a href="https://google.com">Google</a>
    <a href="https://medium.com">Medium</a>
    <a href="https://stackoverflow.com">Stackoverflow</a>
    <a href="https://google.com">Google</a>
    <a href="https://medium.com">Medium</a>
    <a href="https://medium.com">Medium</a>
    <a href="https://google.com">Google</a>
    <a href="https://google.com">Google</a>
    <a href="https://google.com">Google</a>
  </li>
</ul>