如何突出顯示父列表項而不突出顯示子列表項？

我在使用Wordpress生成的鏈接列表中遇到問題，它顯示特定的頁面鏈接以及它的所有子頁面鏈接。當您將鼠標懸停在它們上方時，我試圖讓鏈接突出顯示，然後當您點擊它們並導航到該頁面時，該頁面的鏈接將保持突出顯示。我找到了一種方法來主要實現這個使用：如何突出顯示父列表項而不突出顯示子列表項？

#sidebar a:hover{ 
    padding: 7px; 
    background-color: #f7f9fe; 
    color: #728186; 
} 
#sidebar ul > li .current_page_item{ 
    padding: 7px; 
    background-color: #f7f9fe; 
    color: #728186; 
}

但這不允許我突出顯示父頁/李。如果我使用：

#sidebar li.current_page_item

孩子撐突出了它的網頁上，但父頁面上也凸現子項目，不只是本身。

這裏是我的解析PHP：

<ul id="sidebar" class="sidelist"> 
    <li class="pagenav"><h5>WHAT WE DO</h5> 
     <ul> 
      <li class="page_item page-item-39 current_page_item"><a href="http://www.autismrecoveryfoundation.org/meet-the-board" title="Meet the Board">Meet the Board</a> 
      <ul class='children'> 
       <li class="page_item page-item-84"><a href="http://www.autismrecoveryfoundation.org/meet-the-board/being-a-board-member-101" title="Being A Board Member 101">Being A Board Member 101</a></li> 
      </ul> 
      </li> 
     </ul> 
    </li> 
</ul>

這裏是我約WP列表頁面WordPress的頁面（http://codex.wordpress.org/Function_Reference/wp_list_pages）使用的模板標籤：

<?php 
      // use wp_list_pages to display parent and all child pages all generations (a tree with parent) 
      $parent = 39; 
      $args=array(
      'title_li' => '', 
      'child_of' => $parent 
      ); 
      $pages = get_pages($args); 
      if ($pages) { 
       $pageids = array(); 
       foreach ($pages as $page) { 
       $pageids[]= $page->ID; 
       } 

       $args=array(
       'title_li' => '<h5>WHAT WE DO</h5>', 
       'include' => $parent . ',' . implode(",", $pageids) 
      ); 
       wp_list_pages($args); 
      } 
     ?>

來源

2011-01-23 Amanda

更新

要顯示的網頁列表在一個平面列表中，設置depth爲-1：

$args=array(
    'depth' => -1, 
    'title_li' => '<h5>WHAT WE DO</h5>', 
    'include' => $parent . ',' . implode(",", $pageids) 
);

這樣你就不必跟孩子選擇勾搭，你的子頁面將不會被包含在你的主頁的li了。

老答案

問題就出在這個選擇：

#sidebar ul > li .current_page_item

的#sidebar ul部分尋找ul從#sidebar下降，但在你的代碼ul是的#sidebar。此外，li .current_page_item會發現任何.current_page_item裏面的li包含您的標題。

您選擇改成這樣：

#sidebar > li > ul > .current_page_item

你也可以利用這一點，因爲你的專頁小工具都有其自己的類反正：

.pagenav > ul > .current_page_item

來源

2011-01-23 13:45:14 BoltClock

感謝您的幫助！所以我嘗試了你的兩條建議，以及你編輯帖子之前的兩條建議，但他們都沒有這樣做。我嘗試過使用#sidebar> li> ul> .current_page_item，並且它在父頁面上保持父級和子級突出顯示，然後在子頁面上時，兩者都不突出顯示。你介意看看這個頁面嗎？ http://www.autismrecoveryfoundation.org/meet-the-board – Amanda 2011-01-23 14:02:35

如何突出顯示父列表項而不突出顯示子列表項？

回答

相關問題