在媒体查询中覆盖重要规则集？ ！不重要？ [英] Overwrite !important rule set within media-query? !unimportant?

问题描述

想象这个...

@media screen and (min-width: 55.5em) {
    aside[role="attend"] {
        margin:0 !important;
    }
}

@media screen and (min-width: 61.5em) {
    aside[role="attend"] {
        margin:0; /* still !important but shouldn't be */
    }
}

有任何方法覆盖或删除！important 声明，所以它仍然不适用于更高的 min-width value？

Is there any way to overwrite or "remove" the !important declaration so it's not still applied within the higher min-width value?

推荐答案

该方法的级联工作，没有办法撤消！important 声明或使其不重要。

No; the way the cascade works, there is no way to undo an !important declaration or make it "unimportant".

这是不管规则是否出现在不同的 @media 规则或样式表中的任何地方。这意味着它是一样的，虽然你没有开始媒体查询开始：

This is regardless of whether the rule occurs within different @media rules or anywhere else in a stylesheet. That means it's the same as though you didn't have the media queries there to begin with:

aside[role="attend"] {
    margin:0 !important;
}

aside[role="attend"] {
    margin:0;
}

顺便说一下，这是浏览器实际看到的如果 min-width：55.5em 和 min-width：61.5em 媒体查询。

Which, incidentally, is what a browser actually sees if both the min-width: 55.5em and min-width: 61.5em media queries are fulfilled.

你最好找到一个方法来删除！important ，并在第一个 @media中使用更具体的选择器。

You're much better off finding a way to remove that !important and using a more specific selector in your first @media rule instead.

这篇关于在媒体查询中覆盖重要规则集？ ！不重要？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！