Bootstrap模态窗口显示为灰色

Question

转到this site，点击右上角的“登录”，会弹出一个twitter-bootstrap模式窗口，但会显示为灰色。

为什么会这样？

Answer 1

这是因为.navbar-fixed-top的z-index为1030，而模态背景的z-index为1040，导致模态覆盖导航栏。

要解决此问题，只需将.modal-backdrop z-index值调整为低于1030 - 例如

.modal-backdrop {
    z-index: 1020;
}

Answer 2

您也可以使用：

 .modal-backdrop.in { z-index: auto;}

Answer 3

首先，将 data-backdrop =＆＃34; false＆＃34; 添加到您的模态div

然后将以下内容添加到您的样式中：

.modal { background: rgba(000, 000, 000, 0.8); min-height:1000000px; }

不要忘记将关闭按钮添加到您的模态...

<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>

干杯..

Answer 4

我必须添加！重要的是让它工作。

.modal-backdrop {
    z-index: 1020!important;
}