Html 删除：目标标记

我一直在使用css3和target属性来创建一个交互式菜单。单击菜单按钮时，我使用：target属性使其打开子菜单。我只是说，当我的菜单点是目标时，将子菜单高度设置为“自动”，如果不是目标，则其高度应为0

但现在我的问题是：有没有一种简单的方法可以再次移除目标？我想做的是，当我点击菜单按钮时，子菜单将显示（我已经做了）。如果我再次点击同一个按钮，我想再次关闭

---

有没有办法用纯css/html实现这一点，或者我需要改为javascript/jquery来实现这一点？到目前为止，我使用css3来避免这种情况。

您可以创建一个指向另一个锚点的绝对定位链接，该锚点显示在指向您的

:target

的链接前面，并且仅当当前

:target

有效时才显示。因此，它在视觉上表现为切换链接（）：

HTML

---

不使用JS实现切换功能的另一种（也是相当流行的）方法是使用隐藏的复选框/单选按钮及其

：checked

伪类以及CSS同级组合符。但就我个人而言，我怀疑这是否是正确的HTML使用方式。

是的，我认为是这样（或有点）；你能展示你正在使用的（代表性的/最少的）代码吗？一个简单的HTML和CSS复制你的问题，在，或类似的？终于记得，我留下了一个关于这个问题的评论，几个小时前，我想我会看到关于张贴一个答案。然后我找到了你的，这与我处理它的方式非常相似（），所以：+1=）

<div id="test">
    <h2>
        <a href="#test">Open me</a>
        <a href="#" class="untarget"></a>
    </h2>
    <div>
        <p>Some contents</p>
        <p>Some more contents</p>
        <p>Some more contents again</p>
    </div>
</div>

h2 {
    position: relative;
    display: inline-block;
}

.untarget {
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    display: none;
}

:target .untarget {
    display: block;
}