Html 可以在一个css元素中使用多个子选择器吗？

因此，我试图创建一个隐藏的下拉菜单，我只希望外部的

li

具有特定的css元素。我想知道您是否可以使用多个子选择器，

，这样我就可以应用于那些

li

中的链接，而不是应用于较小菜单中的链接

例如：

<ul class="top">
  <li>
    <a href="#">random</a>
    <ul class="second">
       <li>
          <a href="#">random second</a>
       </li>
    </ul>
  </li>
  <li>
    <a href="#">random</a>
    <ul class="second">
       <li>
          <a href="#">random second</a>
       </li>
    </ul>
  </li>
  <li>
    <a href="#">random</a>
    <ul class="second">
       <li>
          <a href="#">random second</a>
       </li>
    </ul>
  </li>
  <li>
    <a href="#">random</a>
    <ul class="second">
       <li>
          <a href="#">random second</a>
       </li>
    </ul>
  </li>

然而，我希望

ul.second

中的

a

作为一个随机示例，具有

颜色：蓝色
如果您希望以“外部”链接为目标，您应该按照您写的那样做：

ul.top > li > a {
   color: red;
}

如果您想定位“内部”链接，只需使用以下任一选择器：

ul.top ul a {
   color: green;
}

或

这样，您只针对下拉列表之外的链接。这就是你想要实现的吗？@user2915402我正在尝试使外部链接比内部链接具有单独的css功能。因为我的实际代码有几个重要的css外部导航功能，我不想在内部导航中使用。是的，我最终自己解决了，但我一定会保留这些功能，以备将来参考。谢谢你的帮助！
ul.top ul a {
   color: green;
}

ul.second > li > a {
   color: green;
}