Css 更改整个页面的颜色

我有一个按钮，它可以创建一个弹出窗口，并使我的页面背景变黑。这是可行的，但不会影响任何引导容器。我目前正在使用bootstrap 4和react

我对这个流行音乐的css如下

.popup {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    background-color: rgba(0,0,0, 0.5) !important;
}
.popupInner {
    position: absolute;
    left: 25%;
    right: 25%;
    top: 25%;
    bottom: 25%;
    margin: auto;
    border-radius: 20px;
    position: absolute;
    left: 25%;
    right: 25%;
    top: 25%;
    bottom: 25%;
    margin: auto;
    background: white;
}

---

任何人都知道如何定位这些容器。

在弹出窗口上设置z-index可能会修复它（例如，

z-index:1

）

---

如果这不能解决问题，您可能需要在那些引导元素上设置一个较低的z索引（例如，

z-index:0

）

，以解决问题。为.popup指定了一个z索引：100，为popupInner指定了一个z索引：101