仅使用 wp nav 菜单显示当前页面子菜单

Question

我正在尝试仅使用 wp nav 菜单和 css 显示第三层菜单项，但我没有任何运气。我的菜单结构如下：

Tier 1 Menu Item
Tier 1 Menu Item
Tier 1 Menu Item (Page Parent)
    Tier 2 Menu Item
    Tier 2 Menu Item
    Tier 2 Menu Item (Current Page)
        Tier 3 Menu Item (Current Page Child)
        Tier 3 Menu Item (Current Page Child)

我试图隐藏除当前页面的孩子之外的所有内容。 IE - 我想隐藏所有第 1 层和第 2 层菜单项并仅从当前页面显示第 3 层菜单项。

我的菜单有一个 .jo-child-menu 容器类，我正在使用以下 css 来尝试实现它：

ul.jo-child-menu li{display:none;}
ul.jo-child-menu ul.sub-menu li{display:none;}
ul.jo-child-menu ul.sub-menu li.current-page-item ul.sub-menu li{display:block;}

结果是没有显示任何菜单项。我尝试了许多其他的 css 行，但它们要么给我整个菜单，要么没有菜单，要么只给我第一层或第二层菜单项。

Answer 1

你对这个例子的看法

 <ul id="coolMenu">
    <li>
        <a href="#"> 
            <img src = "gear_icon.png" class = "nav" height = "20px" width = "20px" style="display:none">insertimage
        </a>
        <ul>
            <li>
                <a href = "#"> Colors </a>
                <ul>
                    <li><a href = "#"> Blue </a></li>
                    <li><a href = "#"> Green </a></li>
                    <li><a href = "#"> Red </a></li>
                </ul>

            </li>
            <li><a href="#">Background</a></li>
            <li><a href="#">Indulgentia</a></li>
        </ul>
    </li>
</ul>

http://jsfiddle.net/kisspa/2bqQL/