僅在一頁上更改元素

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

我檢查了您的網站，並在一個body元素上堆滿了很多類名。

問題：所有選擇器中都有空格。

.class1 .class2選擇具有的類名的元素class2這與類名的元素的子class1 。

.class1.class2在選擇器中沒有空格，因此它選擇一個類名都為.class1和.class2 。

更正：

.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是body元素的子元素。

希望有幫助！

Answer 2

試試看：

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

Answer 3

如果是單個頁面，則可以使用！important設置樣式

<div style="background:red!important;">
    <p>Example</p>
</div>