css - 通过单击另一个元素更改元素的 css 样式

Question

我有这样的结构:

<div id="d1">
Text
<div id="d2">Word</div>
<a href="#hide">My other text</a>
</div>

现在，我希望在点击 #hide:target 时，div#d2 消失。

我可以用 CSS 做到这一点吗？

Answer 1

您可以使用 CSS 做到这一点!

如果稍微更改 HTML 标记，可以使用 CSS :target

    #d2:target {
        display: none;
    }

    <div id="d1">
      Text
    <div id="d2">Word
      <a href="#d2">My other text</a>
    </div>