html - 如何让标签悬停也适用于包装跨度

我有一个带有背景图片的 span 标签，然后在其中我有一个带有文本链接的标签。 span 的背景图像设置在文本链接的右侧。我希望当您滚动 a 标签时，它也可以覆盖处于悬停状态的跨度背景图像。我尝试过类似的方法，但仍然无法正常工作。

        span a:first-child + span a:hover{
            cursor: pointer;
        }

标记 html

        <div class="wrapper">
            <span>Study Bill</span>
            <span><a href="#">Download PDF</a></span>
        </div>

最佳答案

反其道而行之；用一个大 <a> 包裹你的跨度标记，并将链接文本写在 <span> 内.例如:

<a href = "#">
    <span style = "background-image: url(your_image.png);">
        Download PDF
    </span>
</a>

关于html - 如何让标签悬停也适用于包装跨度，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/11959456/