覆盖CSS媒体查询

前端之家收集整理的这篇文章主要介绍了覆盖CSS媒体查询前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我每天都使用一个使用CSS媒体查询页面,我不喜欢;我宁愿使用完整的页面(大多数与Twitter Bootstrap菜单相关,缩小比768px窄)。

有没有办法用CSS覆盖Bootstrap的媒体查询?最好不定义我自己的媒体查询来单独覆盖所有的规则,因为我觉得这将需要很长时间。

编辑:我没有源代码的控制权,否则我会杀死引导响应代码

解决方法

你为什么不先删除它们?

如果你不能,你仍然可以用规则覆盖一个CSS声明:

>具有相同的选择器优先级,并在MQ块之后
>具有比MQ块中的规则更高的选择器优先级
>有价值和分号之间重要的!

/* one id,one class AND one element => higher priority */
    #id element.class { property: value2; }

    /* !important will nuke priorities. Same side effects as a nuke,don't do that at home except if you've tried other methods */
    #id .class { property: value2 !important; }

    @media(blah) {
      /* Overridden. Thrice. */
      #id .class { property: value1; }
    }

    /* same selector,same everything except it comes after the one in @media?
       Then the latter is applied.
       Being in a @media doesn't give any more priority (but it won't be applied
       everywhere,depending on "blah",that's the point of MQ) */
    #id .class { property: value2; }

在前面的例子中,@media块之外的任何声明都会覆盖里面的一个。值2将被应用而不是value1有3个原因。

猜你在找的CSS相关文章