引导“.panel-heading”不透明度？

Question

所以，我正在尝试将引导面板标题设置为透明。
由于 z-index 我不知道该怎么做。

panel-heading 在 panel-default 的顶部。

HTML

<div class="panel panel-default">
  <div class="panel-heading"></div>
  <div class="panel-body"></div>
</div>

CSS

.panel-default{
  background: rgba(255, 255, 255, 0.9);
}
.panel-default .panel-heading{
  background: rgba(255, 255, 255, 0.0);
}
.panel-default .panel-body{
  background: rgba(255, 255, 255, 0.95);
}

我已尝试使整个面板（面板默认）透明，
然后给身体涂上白色。这里的问题是面板主体没有覆盖标题下方的整个空间。我刚得到一个白色区域，里面有一些内容/文本。

如果我将面板默认设置为纯白色，我无法通过透明面板标题“通过”它。因为标题在面板默认的顶部。

更新
所以我的问题是我希望标题是透明的，但身体是实心的。以及覆盖面板标题下方整个空间的主体。

编辑
我尝试将面板主体的高度设置为 100%，但它仍然没有覆盖面板标题下方的整个空间。

更新
面板主体没有覆盖整个空间的问题是因为我设置了面板默认高度。我应该设置面板主体高度！

Answer 1

使用下面的 CSS ，可能对你有帮助。

CSS

.panel-default{
    background: transparent;
}
.panel-default .panel-heading{
    background: transparent;
}
.panel-default .panel-body{
   background: #fff;
}