活动状态在锚标签中粘贴有块元素

Question

我的标记看起来像这样：

<dl class="synthModels">
    <a href="#" class="soundTest">
        <dt><span>Bass Drum</span></dt>
        <dd>Bass drum description.</dd>
    </a>
    <a href="#" class="soundTest">
        <dt><span>Bass Drum</span></dt>
        <dd>Bass drum description.</dd>
    </a>
</dl>

这样的CSS：

.synthModels a:hover dt {
    color: #ff571b;
}
.synthModels a:active dt {
    color: #aed9e0;
}

悬停工作正常，但由于某种原因，即使您单击链接后活动状态仍然有效，而不是仅在单击链接时。你可以在这里亲自尝试一下“Bass Drum”，“Synth Clap”等等：

http://sans-concept.com/as/drumspillage.html

为什么会发生这种情况？我尝试删除DL并使用H3 / P交换DT / DD，但问题仍然存在。谢谢你的帮助！

Answer 1

我只是想通了。我尝试将我的锚标记更改为显示：阻止，这绝对解决了问题。万岁！

Answer 2

活动选择器不适用于页面跳转锚点，仅适用于外部锚点。 在页面跳转锚点中，活动选择器将样式应用于页面锚点中的所有页面。 它可以与外部链接一起使用，例如当您的网页上每个页面都有一个菜单时，可以使用活动选择器在您当前所在页面的菜单中进行证明。

在您的情况下，您可以尝试使用焦点选择器。