Jquery 引导模式不'；添加命名空间后无法工作

我在引导css文件中添加了名称空间以避免冲突。然而，在那之后情态动词就不能正常工作了。添加的内容没有被我的同名div包围，因此无法工作

下面是一个例子：

<div class="ssl">
    <button type="button" class="btn btn-primary" data-toggle="modal" data-target=".bs-example-modal-sm">Small modal</button>
</div>
<div class="ssl">
    <div class="modal fade bs-example-modal-sm" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel">
      <div class="modal-dialog modal-sm">
        <div class="modal-content">
      This is the modal content.
        </div>
      </div>
    </div>
</div>

---

有人能通过提出一些想法来帮助我解决这个问题吗？

在Bootstrap4.1中添加名称空间后，我找到了解决这个问题的方法。 您必须将名称空间从模式背景中删除，基本上，将其从以下位置更改：

.namespace .modal-backdrop {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1040;
  background-color: #000;
}

.namespace .modal-backdrop.fade {
  opacity: 0;
}

.namespace .modal-backdrop.show {
  opacity: 0.5;
}

为此：

.modal-backdrop {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1040;
  background-color: #000;
}

.modal-backdrop.fade {
  opacity: 0;
}

.modal-backdrop.show {
  opacity: 0.5;
}

在我的例子中，自定义引导是在一个容器中使用的，而不是整个页面，因此当我创建一个模式时，在容器外部创建了一个新的分区，这是自定义CSS无法触及的

.modal-backdrop {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1040;
  background-color: #000;
}

.modal-backdrop.fade {
  opacity: 0;
}

.modal-backdrop.show {
  opacity: 0.5;
}