如何从外部 CSS 中仅删除一个媒体规则属性答案

【问题标题】：How to remove only one media rule property from external css如何从外部 CSS 中仅删除一个媒体规则属性
【发布时间】：2026-02-18 15:15:01
【问题描述】：

我有 bootstrap.min.css，它定义了：

@media (min-width: 768px) .modal-dialog {
    width: 600px;
    margin: 30px auto; 
}

@media (min-width: 992px) .modal-lg {
    width: 900px;
}

我想要宽度：自动；用于 768 到 992px 之间的“modal-dialog modal-lg”屏幕。所以我在我的 css 中尝试：

@media (min-width: 768px) .modal-dialog {
    width: auto !important;
}

但这并不适用。

然后，我用谷歌搜索了这样的内容：

@media (min-width: 768px) {
  body .modal-dialog {
      width: auto !important;
  }
}

但这也覆盖了@media（最小宽度：992px）。如何仅覆盖 (min-width: 768px) 规则？

【问题讨论】：

【解决方案1】：

这个媒体查询应该达到你的要求。您可以设置应用所需更改的最小和最大宽度。

@media (min-width: 768px) and (max-width: 992px) {
    .modal-dialog {
        width: auto;
    }
}

!important 不是必需的，除非您必须覆盖另一个 !important :)

【讨论】：