【问题标题】:Bootstrap 4 Modal OpacityBootstrap 4 模态不透明度
【发布时间】:2018-03-11 03:54:33
【问题描述】:

所以我正在使用 Bootstrap 4 Beta 并希望在显示模态时使背景变暗。我看到一个帖子,我只需要添加 css 类

.modal-backdrop.in {
    opacity: 0.5 !important;
    position: fixed;
}

到我的 CSS 文件。他们写道,我不需要将类添加到 div,只需将其添加到 CSS 文件中即可。所以如果我只是添加它,它不会发生任何事情。如果我随后将该类也添加到我的模态 div 中,那么一切都会获得不透明度,甚至是模态本身。有人知道如何解决这个问题吗?

【问题讨论】:

    标签: html css bootstrap-modal bootstrap-4


    【解决方案1】:

    只需通过覆盖来更新模态框的当前 CSS 类。

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

    .show 是包含背景不透明度的类。

    【讨论】:

    • 所以我用 .show 替换了 .in 但结果是一样的。
    • 您还必须覆盖 CSS。
    • 覆盖是什么意思?我在css文件中替换了它
    • 我已经修好了。问题是我用 $("#myModal").show() 触发了模态我构建了一个不可见的按钮,该按钮将由 .click() 调用,然后调用在 data-target 属性中设置的原始模态跨度>
    • 更新:意识到我不需要构建一个不可见的按钮。我现在使用 .modal("show") 而不是 .show()。
    猜你喜欢
    • 1970-01-01
    • 2019-02-18
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2020-03-14
    • 1970-01-01
    • 2010-09-30
    相关资源
    最近更新 更多