html - 单击 div 2 内的链接应隐藏 outer-div 1

Question

我有两个并排的 div。当超链接的状态为 active(单击时)，我想使用 display: none; 将 div 隐藏到左侧。

我大约一年前做过这件事，但由于这是我从那以后的第一个网站，所以我不记得我是怎么做到的。

我知道它可以单独在 CSS 中使用 :active 来完成，但我不确定如何做。我该怎么做？

Answer 1

将“一般兄弟”选择器 ~ 与 a:active 结合使用

HTML

<a href="#" name="trigger">Click Me</a>
<hr />
<div class="foo"></div>
<div class="bar"></div>

CSS

a:active ~ .foo {
    display: none;   
}

它基本上是说:找到类为 foo 的 div，它是事件 anchor 的同级并隐藏它。不要与相邻的兄弟选择器混淆，+

在此处查看演示:http://jsfiddle.net/DNy2B/