WordPress的子菜单上的活动属性

我一直在为这个问题奋斗了几周，真的很想找到解决这个CSS问题的方法。如果甚至有可能，当父母处于活动状态时，如何使子菜单保持可见状态？WordPress的子菜单上的活动属性

这个CSS在hover属性上效果很好，但无法弄清楚如何使子菜单块保持可见状态：active。

<nav id="menu" role="navigation"> 
    <?php wp_nav_menu(); ?> 
</nav><!-- #menu -->

#menu ul li:hover ul.sub-menu, 
#menu ul li:hover ul.sub-menu li, 
#menu ul li:hover ul.sub-menu li a { display: block; }

会很感激一些帮助或任何想法都让我不要浪费更多的时间来试图解决这个问题，如果它不能只用CSS来解决。

问候，Bellisia

编辑：

<nav id="menu" role="navigation"> 
    <div class="menu-headmenu-container"> 
     <ul id="menu-headmenu" class="menu"> 
      <li id="menu-item-17" class="menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-5 current_page_item menu-item-17"> 
       <a href="http://yyy.com/">Home</a> 
      </li> 
      <li id="menu-item-15" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-15"> 
       <a href="http://yyy.com/services/">Services</a> 
       <ul class="sub-menu"> 
        <li id="menu-item-20" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-20"> 
         <a href="http://yyy.com/contact/">Contact</a> 
        </li> 
       </ul> 
      </li> 
     </ul> 
    </div> 
</nav><!-- #menu -->

来源

2012-02-17 Bellisia

导航的HTML是怎么样的，即一旦它由Wordpress生成并发送到浏览器？ – 2012-02-17 14:34:53

以上添加:) – Bellisia 2012-02-17 14:49:59

@StephenHarris这是我们为_close_ votes（off topic）或_flag_（move to so）所做的。 – kaiser 2012-02-17 09:56:24

当你点击发言权联系（分导航项目），的（* current_page_item *）类应适用于李？

在这种情况下，你能不能只用..

#menu ul li ul.sub-menu li.current_page_item { display: block; }

这将表明其在使用中并显示在该页面加载块？

来源

2012-02-17 15:11:56 Marty

我已经试过，但它不工作:(任何其他想法？ – Bellisia 2012-02-17 15:26:12

我试过了，但没有激活它，因为我已经在使用：悬停它再次消失 – Bellisia 2012-02-20 06:53:32

你将不得不玩弄子菜单的位置，但这里只是一个小提琴，它展示了如何仅用CSS来完成。当您将鼠标悬停在Link 2上时，您将看到一个儿童<ul>出现三个链接。

http://jsfiddle.net/ryancowles/63XBy/

来源

2012-02-17 15:36:50 Ryan

“子Combinator的” 选择是你在找什么，试试下面的CSS。

.current_page_item > ul { display: block; }

唯一需要注意的是，“儿童组合子”选择将选择孩子只有一个级别深，所以不会嵌套子菜单的工作。

HTH

P.S：我假设在这里，你已经安装的WordPress的“current_page_item”类适用于被点击的父菜单项。

来源

2012-02-19 01:20:02

我也试过，但它doesn我猜这是因为我使用的悬停效果，我只是需要它保持在那里，它被点击。 – Bellisia 2012-02-20 06:54:45

无数个小时，我意识到，我没有使用>正确，以后这里就是它如何结束看起来像：

#menu ul.menu > li.current_page_item > ul.sub-menu { display: block; }

就像一个魅力！但那只是父母，我不能让子菜单项在点击时保持可见，有什么想法？

来源

2012-02-21 13:29:29 Bellisia

WordPress的子菜单上的活动属性

回答

相关问题