我需要帮助使用WordPress店面主题/woocommerce通过styling 特定页面children.

有three 导航选项卡中的类别供用户悬停，每个选项卡都会出现一个下拉列表，其中包含与悬停类别相关的不同页面/项目。

导航栏上每个选项卡/类别内的所有页面应具有不同的背景。

示例：如果我将鼠标悬停在导航选项卡“shoes”上，下拉列表将显示不同的几个鞋品牌：Nike、Adidas、Sketchers。鞋选项卡上的所有页面应具有相同的红色背景色。

另一个导航选项卡可能是帽子，在悬停几个帽子品牌的下拉列表后显示帽子。“帽子”选项卡中的所有页面都应具有相同的蓝色背景色，因为它是hat 选项卡。

我在DOM中看不到任何html标记，这些标记带有放置css的特定类，因此所有页面元素都将获得相同的效果。

示例：

.container .hats {
background: blue;
}

没有可以应用样式的元素。如果我用过的话。容器，则所有页面将获得相同的颜色。

有什么帮助吗？

EDIT

**我的错，我的问题没有具体说明。。它不会更改导航背景颜色，例如：但当用户单击主选项卡“shoes”下的特定品牌“nike”时，加载到浏览器中的页面将以红色背景显示nike的产品**

nav li:nth-child(2) {
}

nav li:nth-child(4) {
}

<nav>
  <li></li>
  <li></li> <-this gets selected
  <li></li>
  <li> <-and this gets selected
    <ul>
      <li></li>
    </ul>
  </li>
</nav>