在Bootstrap模式中使特定的div背景透明

Question

這是我的HTML（引導程序）文檔：

<div modal="showModal" close="cancel()">
    <div class="modal-header text-center">
        <h2>Members who shortlisted you </h2>
    </div>
    <div class="modal-body">
        <img src="kitty.jpg"/>
    </div>
    <div class="modal-footer">
      <button class="btn btn-success" ng-click="ok()">Okay</button>
      <button class="btn" ng-click="cancel()">Cancel</button>
    </div>
</div>

我想使模式標題部分的背景透明，以便可以看到彈出窗口后面的文本和圖像。 我已經嘗試了以下CSS：

.modal-header {
    background-color: #000000;
}

但它不起作用，如果有人能幫助我，那太好了

Answer 1

background-color: #000000; 不透明。

嘗試使用background-color:transparent （這是默認設置）。

或者:background-color:rgba(0,0,0,0) 。

但是，您應該注意，這只會顯示父div的背景。

Answer 2

background-color: #000000不會使背景透明，它只會將background-color為black 。

您可以使用以下三種方法之一：

background-color: transparent -將背景顏色設置為透明

background-color: rgba(0, 0, 0, 0) -最后0將opacity設置為0

opacity: 0將整個div的opacity設置為0