Css 有没有办法让两个兄弟元素相互影响？

假设我有两个元素，“A”和“B”。。。当你在A上悬停时，我希望B改变颜色，当你在B上悬停时，我希望A改变颜色

<ul>
    <li>A</li>
    <li>B</li>
</ul>

A
B

我发现了常见的兄弟选择器，如（~）和（+），但它们只允许A影响B。 我可以使

ul{display:flex；}

交换A和B，但这只允许B影响A

我正在制作的网站中的一切都在运行，我只想制作一种“配对链接”系统。。。基本上，两个链接，如果其中一个悬停在上面，两个都表现得像他们被悬停在上面

---

我试过（-）只是想看看它是否有效，但没有。。。我曾尝试使用（>）将鼠标悬停在父对象上，但这只会使所有链接看起来像被悬停在上面一样（我也这么认为，但我仍然必须尝试）。。。老实说，我从来没有做过html和css，所以我不确定我错过了什么…

通过突出显示悬停列表项的所有列表项，并重置悬停列表项的样式，可以实现类似的效果：

ul{
填充：0；
列表样式：无；
}
ul:hover>.item{
颜色：红色；
}
项目：悬停{
颜色：首字母；
}

A
B