CSS：如何在 Wordpress 上使标题背景透明？答案

【问题标题】：CSS: How to make header background transparent on Wordpress?CSS：如何在 Wordpress 上使标题背景透明？
【发布时间】：2018-06-24 01:49:12
【问题描述】：

我想在我的网站上有一张背景图片。它来自页面顶部，仅位于页眉后面。问题是，我的主题迫使我为标题设置背景颜色，因此您根本看不到我的背景图像。这是我希望网站看起来像的照片：

你可以看到它实际上是什么样子here。我在 Wordpress 上使用 Brunch Pro 主题。

有没有办法让标题背景透明或者有更好的方法来做到这一点？

【问题讨论】：

【解决方案1】：

将此添加到您主题的 custom.css 或 style.css 的末尾：

.brunch-pro .site-header{
    background: transparent;
}

【讨论】：

【解决方案2】：

如果您可以编辑 CSS（我认为您可以在 WP 中编辑），请查找 .site-header 的 CSS 属性设置位置。删除 background 和 background-color 属性。

您也可以只添加一个新的 CSS 属性并将其应用于标题。比如：

header.site-header {
  background: none !important;
}

!important 将覆盖已设置的属性...

【讨论】：

【解决方案3】：

如果需要background-color 属性，您可以使用rgba 颜色并使其透明。 background: rgba(0,0,0,0); 使背景颜色变为黑色，但完全透明，没有不透明度和其他技巧。像这样：

.black-but-transaprent {
  color: red;
  height: 100px;
  width: 100px;
  background: rgba(0,0,0,0);
  border: 1px solid black;
}

&lt;div class="black-but-transaprent"&gt;Test&lt;/div&gt;

【讨论】：