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) 应用的样式被具有更高特异性值的不同类样式覆盖。 我不知道您的示例是否属于这种情况，但它们是首先想到的两件事。尝试检查浏览器中的元素，看看是否完全引用了您的选择器。以及特定样式是否被现有样式覆盖。