html - 当我使用#element:target #otherelement时，它不起作用

所以我试图以这种方式使用:target：

#Menu:target #buttons {
    dipslay: flex !Important;
}

这根本不起作用。它甚至没有显示在DOM中。这是HTML结构：

<a href="#Menu" id="Menu">&#9776;</a>
<span id="buttons">
</span>

那我在做什么错？
它应类似于以下示例：
https://www.html-seminar.de/rwd/nav-responsive-design-ohne-js.htm#nav-menue

将该网站的大小调整为500px，然后单击右上角的蓝色按钮。

单击按钮后，您会看到菜单正在打开。

最佳答案

您的span#buttons在a#Menu标记之外，但要正常工作，它应该在内部...也是仅供参考，最好使用类来标记按钮，以避免可能的通用ID 将来。

<a href="#Menu" id="menu">
   &#9776;
   <span class="menu-buttons">
   </span>
</a>

CSS将如下所示：

#menu:target .menu-buttons {
    dipslay: flex;
}