CSS - 在 wordpress 自定义菜单中选择一个元素

Question

我正在尝试清理自定义主题中的一些自定义 CSS，该主题突出显示当前导航页面的 wordpress 自定义菜单（即；查看“联系人”页面时突出显示“联系人”菜单项）。

当前的 CSS 引用每个自定义菜单的 ID 来应用以下样式，并为每个自定义菜单提供一个副本：

#nav_menu-8.widget .current-page-item > a
{}

我试图理解为什么在不引用 ID nav_menu-8 的情况下尝试选择相同元素时样式不适用，理想情况下是比静态引用更动态的东西：

.widget .current-page-item > a
{}

当上面的 CSS 就位时 - 样式不会像我期望的那样应用（适用于在类小部件内具有类 current-page-item 的父级的任何 A 元素）。

很想看看我哪里出错了！ 谢谢。

Answer 1

它不起作用的几个一般原因； a) html 中的元素结构与 css 中的选择器不匹配。 b) 应用的样式被具有更高特异性值的不同类样式覆盖。 我不知道您的示例中是否是这种情况，但它们是首先想到的两件事。尝试检查浏览器中的元素，看看您的选择器是否被引用。以及特定样式是否被现有样式覆盖。