Css 使模态对话框固定宽度，但当屏幕重新调整尺寸小于它时，它必须重新调整尺寸

我使用的是默认的bootstrap3 css文件

我注意到模式对话框的默认css宽度是600px

然而，我需要的宽度是1000像素为我的屏幕

如果屏幕大于1000px，则模式宽度仍需为1000px

<style>
    .modal-dialog { width: 1000px; }
</style>

.modal对话框{宽度：1000px；}

这是正确的，但是如果我将窗口的大小调整为小于1000px，则对话框需要根据窗口宽度相应地调整大小，例如，与窗口宽度相同。 当调整大于1000px的窗口大小时，它必须保持与1000px相同的宽度

我试了一套

<style>
    .modal-dialog { width: auto; }
</style>

.modal对话框{width:auto；}

但是，该行为与默认boostrap匹配，并且大小仍然是默认的600px，如果您将其大小调整为小于600px，则它是自适应的。我基本上想要与默认引导css相同的行为，但大小为1000px

---

我在中尝试了答案的组合，其中涉及设置模式对话框的宽度，但无法找到有效的解决方案

只需将以下CSS属性添加到

.modal对话框

元素中，就可以做到这一点

width: 100%;
max-width:1000px;

---

这将使模式为屏幕的全宽，直到达到1000px，此时随着屏幕变宽，模式将保持在1000px。

只需使用

@media

规则即可

@media规则用于为不同的媒体类型/设备定义不同的样式规则

@media（最小宽度：1000px）/*显示区域的最小宽度，如浏览器窗口*/
{
.模态对话框{
宽度：1000px；
}
}

使用此

<style>
    .modal-dialog { 
        width: 1000px; 
        max-width: 100%; 
    }
</style>

.modal对话框{
宽度：1000px；
最大宽度：100%；
}

我研究了默认的boostrap css，找到了一个模态lg示例，它正好做到了这一点。谢谢