使用 Wordpress 菜单“builder”,我得到以下代码:
//Pseaudo code
<ul id="main-menu-main">
<li class="menu-item"><a></a></li>
<li class="menu-item current-menu-ancestor">
<a></a>
<ul class="sub-menu">
<li class="menu-item"><a></a></li>
<li class="menu-item current-menu-item"><a></a></li>
</ul>
</li>
</ul>
// and I use the following CSS
#menu-main-menu a:hover { text-decoration: underline; }
#menu-main-menu .current-menu-ancestor a { text-decoration: underline; }
我最后一行 css 的问题是下面的所有a
元素current-menu-ancestor
都带有下划线。我只希望链接中current-menu-ancestor
带有下划线。
我认为这应该很简单,但是现在我的头没有集中:-/
父/子的完整代码如下所示:
<ul id="menu-main-menu" class="menu">
<li id="menu-item-401" class="menu-item-first menu-item menu-item-type-post_type menu-item-object-page current-page-ancestor current-menu-ancestor current-menu-parent current-page-parent current_page_parent current_page_ancestor menu-item-401">
<a>menu 1</a>
<ul class="sub-menu">
<li id="menu-item-444" class="menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-415 current_page_item menu-item-444">
<a> sub 1</a>
</li>
</ul>
</li>