在特定页面上更改徽标和主菜单颜色

Question

我只想更改此页眉中的徽标和主菜单：

https://www.maisondefemmes.com/galentines-day/

我尝试过更新CSS，但只设法编辑搜索颜色和购物车颜色。

我尝试同时使用content和background-image，也尝试使用logoimg bg--dark而不是#logo，但无济于事。

.page-id-3055 #logo {
    content: url(https://www.maisondefemmes.com/wp-content/uploads/2019/01/mdf-retina-logo-red.png) !important;
}

我希望徽标和主菜单为#b50c3f，但不要让步。我设法更改了搜索和购物车。

Answer 1

徽标是html img标签，您不能以这种方式进行更改。 content属性仅适用于伪元素。一种解决方案如下：

.page-id-3055 .logolink > img {
     display: none;
}
.page-id-3055 .logolink:before {
     display: inline-bloc;
     content: url(https://www.maisondefemmes.com/wp-content/uploads/2019/01/mdf-retina-logo-red.png) !important;
     width: 100%;
     height: 50px;
}

Answer 2

您可以使用jquery检测url，然后通过jquery css更改徽标和菜单

if (window.location.href.indexOf("galentines-day") > -1) {
   // do something
}