仅在一个页面上更改元素

Question

在此网站https://www.nycofficesuites.com/new/上，我想仅更改主页顶部栏的颜色。我试过这段代码：

.home .page .page-id-94 .page-template .page-template-template-home .page-template-template-home-php .wood .top-bar {
  background:blue;
}

以及此代码：

.page-id-94 .top-bar {
  background:blue;
}  

都没有工作。谢谢你的帮助。

Answer 1

我查看了您的网站，并且在一个fabric.operations.put元素上有大量的类名。

问题：所有选择器中都有空格。

body选择一个类名为.class1 .class2的元素，该元素是类名为class2的元素的子元素。

class1在选择器中没有空格，因此它会选择一个同时具有.class1.class2和.class1类名称的元素。

校正：

.class2

OR：

.home.page.page-id-94.page-template.page-template-template-home.page-template-template-home-php.wood .top-bar {
    background:blue;
}

在最后一个选择器之前有一个空格，因为.page-id-94 .top-bar { background:blue; } 是.top-bar元素的子元素。

希望有所帮助！

Answer 2

尝试一下：

.home header.style-4 .top-bar {
  background: #YOURCOLOUR;
}

Answer 3

如果是单页，您可以使用！important

设置样式

forEach