透明模态背景

Question

我正在尝试使模态背景完全透明（特别是对于一个模态），但我很难做到这一点。从文档中可以看出，我可以使用 backdropClass 应用自定义 class。当我打开模式时，我调用：

backdropClass: 'transparent-backdrop'

但无论我在此 class 中放置什么样式（无论是实现透明还是仅更改背景色），背景都不会改变。我的 CSS 看起来像这样：

.transparent-backdrop {
    opacity: 0;
}

我可以使用 windowClass（和 'in' class）修改背景颜色：

windowClass: 'my-window-class'

.my-window-class.in {
   background-color: #000;
}

但是，如果我尝试以类似的方式设置不透明度：

.my-window-class.in {
   opacity: 0;
}

我的背景仍然存在，但现在我的模式消失了。谁能告诉我修改背景不透明度的正确方法？

Answer 1

这对我有用：

.transparent-backdrop.in { opacity: 0; }

这是 Chrome 中显示透明背景的屏幕截图

Transparent modal backdrop