更改 bootstrap 3 模态宽度保持响应性

Question

我刚刚在 this article 上读到，您可以通过以下方式更改引导模式宽度：

.modal .modal-dialog { width: 800px; }

但是当我这样做时，我失去了模态的默认响应能力。

如何更改宽度但保持移动设备的响应能力？

Answer 1

只需使用max-width。它将变得响应-

.modal .modal-dialog { width: 800px; max-width:100%; }

或者，您可以通过媒体查询来实现。

@media only screen and (max-width: 480px) {
    .modal .modal-dialog {
        position:relative;
        width:auto;
        margin: 10px;
    }
}