javascript - 锚标签不可点击的文本重叠问题

Question

在下面的小提琴中，我在这个结构中有带有 href 和背景图像的锚标记，文本停止了 href 到可点击任何想法如何解决这个问题，具有相同的 HTML 结构？

<div class="banner-container">
<div class="banner-box">
    <div class="banner-div">
        <div class="bannerheading">
            <p><span>The correct link should be&nbsp;</span></p>
        </div>
    </div>
    <a href="https://www.google.com/">
        <div class="banner-img" style="background-image:url('https://ssl.gstatic.com/gb/images/i1_1967ca6a.png');">
        </div>
    </a>
</div>

请检查框内的红色边框不可点击https://jsfiddle.net/uqbhcdn6/1/。

任何想法将不胜感激:)

标签： javascriptjqueryhtmlcss

Answer 1

将pointer-events:none;属性添加到.banner-div类。