css - 失去与父边框 CSS 颜色的关系

Question

我需要我的子菜单链接具有与父列表链接不同的边框颜色。

我的菜单

<ul id="menu">
<li><a href="#">Link</a></li>
<li><a href="#">Link</a></li>
<li class="menuActive"><a href="#">Link</a>
    <ul class='children'>
        <li><a href="#">subLink</a></li>
        <li><a href="#">subLink</a></li>
        <li><a href="#">subLink</a></li>
    </ul>
</li>
</ul>

我的 CSS :

#menu li a{
border-bottom-width:2px;
border-bottom-style:solid;
border-bottom-color:red;
text-decoration:none;
}

.children li a{
border-bottom-color:blue;
background:lightgray;
}

如您所见，我的子链接有红色边框，如何为它们设置蓝色边框？ See it in jsFiddle

Answer 1

使用#menu .children a。

这是一个关于 specificity 的问题.

Live Demo