使用CSS设置论文下拉菜单的样式

我使用的是Wordpress Thesis主题, 该主题带有一个标准的下拉菜单, 我想将其转换为两层的水平菜单。我想拥有的是, 当你单击父项时, 该父项的子项(但没有其他子项)是可见的。
结构是这样的:

< ul class="menu"> < li class="tab tab-home"> < a href="http://dirtydeals.org.uk"> Home< /a> < /li> < li class="tab tab-1 current-parent"> < a href="http://dirtydeals.org.uk/about/"title="About"> About< !--[if gte IE 7]> < !--> < /a> < !--< ![endif]--> < !--[if lte IE 6]> < table> < tr> < td> < ![endif]--> < ul class="submenu submenu-1"> < li class="item item-1 current"> < a href="http://dirtydeals.org.uk/about/subnavigation-page/" title="Subnavigation page"> Subnavigation page< /a> < /li> < li class="item item-2"> < a href="http://dirtydeals.org.uk/about/sub-page/" title="Sub-page"> Sub-page< /a> < /li> < /ul> < !--[if lte IE 6]> < /td> < /tr> < /table> < /a> < ![endif]--> < /li> < li class="tab tab-2"> < a href="http://dirtydeals.org.uk/action/"title="action"> action< /a> < /li> < li class="tab tab-3"> < a href="http://dirtydeals.org.uk/media/" title="Media"> Media< !--[if gte IE 7]> < !--> < /a> < !--< ![endif]--> < !--[if lte IE 6]> < table> < tr> < td> < ![endif]--> < ul class="submenu submenu-1"> < li class="item item-3"> < a href="http://dirtydeals.org.uk/media/sample-page-2/"title="Sample Page"> Blog< /a> < /li> < /ul> < !--[if lte IE 6]> < /td> < /tr> < /table> < /a> < ![endif]--> < /li> < /ul>

我的工作相当不错, 但是问题是我找不到一种专门针对子项的方法。如果在查看” 关于” 时隐藏” 博客” , 则当查看” 关于” 的子项之一时, 它还会隐藏” 关于” 的子项或全部子菜单。
这是我的CSS:
/*Remove the hover drop-down effect*/ .custom .menu ul { position: absolute; visibility: visible; list-style: none; z-index: 110; }/*No clears on this so we can make the submenu horizontal*/ .custom .menu ul li { clear: none; }/*Styling the submenu*/.custom ul.submenu { margin: 0px 0 0 0; }.custom ul.submenu a { font-size: 1.3em; text-transform: uppercase; padding-right: 10px; }.custom ul.menu li ul.submenu li.item { display: inline; }.custom ul.menu li.current ul.submenu li.item { display: inline; }.custom ul.menu li { border: 1px solid red; }.custom ul.menu li ul.submenu li.item a {}/*Hacking the submenu to make children work when a subpage is viewed*/.custom ul.menu li ul.submenu li.item a { display: inline; } .custom ul.menu li ul.submenu li.item a { border: 1px solid yellow; } .custom ul.menu li.current-parent ul.submenu { border: 1px solid blue; } .custom ul.menu li.current-parent ul.submenu li.item a { border: 1px solid white; }.custom ul.menu li.current ul.submenu { background-color: #444444; padding: 10px; width: 500px; }.custom ul.menu li.current ul.submenu li.item { display: inline; white-space: nowrap; }.custom ul.menu li.current ul.submenu li.itema { background-color: transparent; display: inline; }.menu ul, .menu ul li { width: 18em; }.custom ul.menu li.current ul.submenu li.item:after { content: "/"; font-size: 14px; }.custom ul.menu li.current ul.submenu li:last-child:after { content: ""; }/*Annoyingly each individual submenu has to be positioned separately*/ .custom ul.menu li.current ul.submenu-1 { position: absolute; left: -110px; }

请问一个比我更理性的大脑和比我更好的眼睛的人可以看看吗?谢谢!
该页面位于:http://dirtydeals.org.uk/about/subnavigation-page/
#1【使用CSS设置论文下拉菜单的样式】你可以使用wordpress中的条件标签轻松实现这一目标。例如仅当页面不是” 关于” 时, 以下代码才会显示” 博客”
< ul class="menu"> < li class="tab tab-home"> < a href="http://dirtydeals.org.uk"> Home< /a> < /li> < li class="tab tab-1 current-parent"> < a href="http://dirtydeals.org.uk/about/"title="About"> About< !--[if gte IE 7]> < !--> < /a> < !--< ![endif]--> < !--[if lte IE 6]> < table> < tr> < td> < ![endif]--> < ul class="submenu submenu-1"> < li class="item item-1 current"> < a href="http://dirtydeals.org.uk/about/subnavigation-page/" title="Subnavigation page"> Subnavigation page< /a> < /li> < li class="item item-2"> < a href="http://dirtydeals.org.uk/about/sub-page/" title="Sub-page"> Sub-page< /a> < /li> < /ul> < !--[if lte IE 6]> < /td> < /tr> < /table> < /a> < ![endif]--> < /li> < li class="tab tab-2"> < a href="http://dirtydeals.org.uk/action/"title="action"> action< /a> < /li> < li class="tab tab-3"> < a href="http://dirtydeals.org.uk/media/" title="Media"> Media< !--[if gte IE 7]> < !--> < /a> < !--< ![endif]--> < !--[if lte IE 6]> < table> < tr> < td> < ![endif]--> < ul class="submenu submenu-1"> < ?php if ( !is_page('about') ) { ?> < li class="item item-3"> < a href="http://dirtydeals.org.uk/media/sample-page-2/"title="Sample Page"> Blog< /a> < /li> < ?php } ?> < /ul> < !--[if lte IE 6]> < /td> < /tr> < /table> < /a> < ![endif]-->

    推荐阅读