Html 如何将跨距悬停在标记内

我有一个a标记，在a标记内是一个span，其中有一个名为“arrow”的类。 我在a标签上有一个悬停样式，它将文本变成蓝色。当a标记悬停在上方时，我还希望箭头变成蓝色

<div id="results" class="center">
    <div class='link'>
        <a href="#">How to use SimplyBuilt support</a>
        <span class="arrow"></span>
    </div>
</div>

---

要选择当前项目旁边的内容，请使用

+

#results .link a:hover+.arrow

这应该可以做到

#results .link a:hover span{
   /* your style */
}

---

这就是你想要的吗？

难道

a:hover

不应该在

箭头之前吗？
也许这样做可以：

#results .link a:hover .arrow {
  background-color: red; } 

基于此：

<div id="results" class="center">
    <div class='link'>
        <a href="#">How to use SimplyBuilt support</a>
        <span class="arrow"></span> <!-- this span is NOT inside the a.href -->
    </div>
</div>

您可以将目标设置为
。链接a:hover.arrow
箭头不在a内，您可以从我的帖子中看到。html在帖子中。你还需要什么html呢？？
<div id="results" class="center">
    <div class='link'>
        <a href="#">How to use SimplyBuilt support</a>
        <span class="arrow"></span> <!-- this span is NOT inside the a.href -->
    </div>
</div>

<div id="results" class="center">
    <div class='link'>
        <a href="#">How to use SimplyBuilt support
        <span class="arrow"></span> <!-- this span IS inside the a.href -->
        </a>
    </div>
</div>