更改標簽的背景色

Question

我有一個非常基本的HTML內置菜單結構。

<ul id="menu-navigation">
    <li id="menu-item-1">
        Menu Item 1
    </li>
    <li id="menu-item-2" class="current-menu-item">
        <a href="#">Menu Item 2</a>
        <ul class="sub-menu">
            <li class="sub-1"><a href="#">Sub-menu Item 1</a></li>
            <li class="sub-2"><a href="#">Sub-menu Item 2</a></li>
            <li class="sub-3"><a href="#">Sub-menu Item 3</a></li>
        </ul>
    </li>
    <li id="menu-item-3">
        Menu Item 3
    </li>
    <li id="menu-item-4">
        Menu Item 4
    </li>
</ul>

我正在嘗試使用...僅針對名為菜單項2的標簽

#menu-navigation .current-menu-item a{background:blue;}

但這也使子菜單中的所有鏈接也變藍了。 如何僅定位第一個標簽？

Answer 1

#menu-navigation .current-menu-item > a {
    background:blue;
}

看看： http : //css-tricks.com/child-and-sibling-selectors/

Answer 2

使用子選擇器 ：

#menu-navigation .current-menu-item > a {
    background: blue;
}