Bootstrap模态窗口显示为灰色

Question

转到此站点,单击右上角的"登录",将弹出一个twitter-bootstrap模式窗口,但显示为灰色.

为什么会这样？

Answer 1

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

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

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

Answer 2

您还可以使用:

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

Answer 3

首先,将data-backdrop ="false"添加到模态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>

干杯..