除了WP中具有current-menu-ancestor的项目之外，如何隐藏完整菜单

Question

我有一个Wordpress网站，我正试图解决一个非常简单的问题。我在顶部有一个主菜单，在左侧有一个辅助菜单。顶部菜单包含1级项目，而左侧菜单包含所有项目。对于左侧菜单，我使用内置的“自定义菜单”小部件。

为了简化外观，我想只显示左边与当前区域相关的项目，即带有current-menu-ancestor的项目。

1. 有没有办法优雅地做到这一点，只在HTML中生成所需的代码？要么在functions.php中使用一些自定义函数（我使用Twenty Eleven子主题），要么使用某些“高级自定义菜单”插件（如果有的话）？

2. 我正在尝试用CSS做，我几乎就在那里。我选择了绿色项目，我喜欢保留和红色我想隐藏的内容，但我不能将CSS规则应用于display: none红色项目，因为它也隐藏了绿色项目。

   < / LI>

   到目前为止我的CSS是这样的：

   #secondary ul {background: red;}
   
   #secondary li.current-menu-ancestor ul,
   #secondary li.current-menu-item ul {background: green;}
   

   这是一个示例页面，您可以在其中查看我正在尝试隐藏的红色项目，以及哪些是我要保留的绿色项目。

   http://kozossegikertek.hu/csatlakozz/

   我想在左侧菜单中只显示绿色项目。

Answer 1

好的，我做了纯CSS解决方案。如果有人可以做到，我仍然需要WP专用解决方案：

#secondary li a {
display: none;
}

#secondary li.current-menu-item ul a,
#secondary li.current-menu-ancestor ul a {
display: inherit;
}

Answer 2

要通过CSS隐藏元素，请使用display: none;属性。

对于像菜单这样的东西，你会想要在满足条件时使用Javascript来改变隐藏元素的css（悬停/点击）。