Bootstrap ".panel-heading" opacity?

Question

Итак, я пытаюсь настроить прозрачность панели Bootstrap Panel.
Из-за индекса z я не могу понять, как это сделать.

Заголовок панели находится по верхности панели по умолчанию.

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); 
} 

Я пытался сделать всю панель (панель по умолчанию) прозрачный,
, а затем отдал тело белого цвета , Проблема здесь в том, что панель-панель не покрывает все пространство под заголовком. Я просто получил белую область, где у меня есть контент/текст.

Если я делаю панель сплошным белым, я не могу «получить через» ее с прозрачным заголовком панели. Поскольку заголовок находится на верхней панели панели по умолчанию.

UPDATE
Так что моя проблема в том, что я хотел бы заголовок быть прозрачным, но тело быть твердым. И тело, чтобы покрыть все пространство под заголовком панели.

EDIT
Я попытался установить высоту для панели-тела до 100%, но это все еще не охватывает все пространство под панелью-заголовка.

UPPDATE
Проблема на панели тела AINT покрова все пространство было, потому что я поставил панель по умолчанию высоту. Вместо этого я должен был установить высоту панели.

Answer 1

Использование ниже CSS, возможно, это может помочь вам.

CSS

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