css - 用 css 替换特定 wordpress 页面上的 Logo

Question

我正在尝试为我网站上的特定页面显示不同的 Logo 。我添加了一个针对特定页面 ID 的 CSS 规则，它成功地交换了 Logo ，但仅限于 Chrome 和 Safari。但在 Firefox 和 IE 上它不会交换 Logo (它只显示原始 Logo )

.page-id-1973 #logo {content: url(http://example.com/wp-content/uploads/2017/04/new-logo.png) ;}

你能告诉我如何使它与 Firefox 和 IE 兼容，或者有其他实现方式吗？

谢谢

Answer 1

content是wrong css property用于将图像应用于节点。那份工作属于background :

.page-id-1973 #logo {
     background: url(http://example.com/wp-content/uploads/2017/04/new-logo.png);
}

你也可以使用 background-image

如果您要替换的图像在 dom 中为 <img>标记你可以这样做来隐藏它并保留原来的高度和宽度:

.page-id-1973 #logo img { visibility: hidden; }