javascript - 阴影 Bootstrap 框对话框

Question

我正在使用bootbox创建 Bootstrap 模式。以下是我创建示例的方法:

bootbox.dialog({message: "hello"});

我的问题是渲染的对话框有点被禁用(所有屏幕都被遮蔽)，我无法单击它，甚至 ESC 也无法使模式消失!

当我检查浏览器中的对话框元素时，我看到的是:

<div class="bootbox modal fade in" tabindex="-1" role="dialog" style="display: block;" aria-hidden="false">
  <div class="modal-backdrop fade in" style="height: 321px;"></div>
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-body">
        <button type="button" class="bootbox-close-button close" data-dismiss="modal" aria-hidden="true" style="margin-top: -10px;">×</button>
        <div class="bootbox-body">hello</div>
      </div>
    </div>
  </div>
</div>

我检查了 bootbox 示例，看起来它与已使用的 CSS 类相同。那么这里出了什么问题呢？

Answer 1

我必须添加以下 CSS 来解决该问题:

.modal-backdrop.fade.in {
  z-index: 0;
}