css - 无法阻止CSS继承

我一直未能阻止子菜单项继承顶级项目的颜色。我知道已经问过类似的问题，但是很抱歉无法使用它们解决我的问题。
CSS：

.Topmenu a{
  color:black;}
.Topmenu.update a{
  color:blue;}
.Submenu a{
  color:black;}

现在，菜单本身看起来像这样：

<div id='Mainmenu'><ul>
<li class='Topmenu update'><a href='Link1'>Link1</a><ul>
<li class='Submenu'><a href='Link2'>Link2</a></li>
</ul></li>

现在，子菜单链接仍然为蓝色。我究竟做错了什么？

编辑：很抱歉造成混淆，它是一个2D菜单，主菜单（Topmenu项目）是水平的，垂直的Topmenu（Submenu项目）是水平的。

最佳答案

这是因为specificity。 .Submenu类被.Topmenu.update覆盖。为避免这种情况，请将.Topmenu.update放在.Submenu类的前面。

.Topmenu a {
  color: black;
}

.Topmenu.update a {
  color: blue;
}

.Topmenu.update .Submenu a {
  color: black;
}

<div id='Mainmenu'>
  <ul>
    <li class='Topmenu update'><a href='Link1'>Link1</a>
      <ul>
        <li class='Submenu'><a href='Link2'>Link2</a></li>
      </ul>
    </li>
  </ul>
</div>