javascript - Bootstrap Modal 上的单独背景淡入淡出

Question

我有一个网站，它大量使用了 Bootstrap Modals。他们以正常方式工作，黑色褪色背景会模糊页面上的内容。

然后我需要一个在加载页面时打开的模式，所以我使用了:

<div class="modal-backdrop fade in" id="purchaseModal" tabindex="-1" role="dialog">

最初这真的很透明，所以我在这里找到了一个答案，说我必须使用以下方法覆盖样式:

.modal-backdrop.fade.in{
opacity: 1 !important;
filter: alpha(opacity=100) !important;
background: #fff;
}

它工作得很好，阻止了模式透明，而是使背景变白。这很好。

然而，当我回到我网站上的任何其他模式时，它们不再像以前那样具有黑色渐变，现在完全透明。我不确定我是否覆盖了错误的内容，或者我是否需要为我需要的第二个模态编写另一个类。

Answer 1

尝试用它的 ID 或 ClassName 覆盖类。

#purchaseModal.modal-backdrop.fade.in{
opacity: 1 !important;
filter: alpha(opacity=100) !important;
background: #fff;
}

它只会与 purchaseModal id 一起工作/覆盖，其他将保持其默认样式。

希望对你有帮助。