我的 HTML 看起来像这样:
<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;
}
工作得很好。
将样式应用到<li>
访问过的链接也适合我。
尝试对上面的内容进行一些修改,这个选择器应该可以工作。在这里,我试图选择任何的兄弟姐妹a
嵌套在li
,后来我忽略了a
哪些尚未访问过。这应该模拟您正在寻找的效果。
Preview for the same:
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>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)